Как работает Array.from({length: 5}, (v, i) => i) '?

Я могу упустить что-то очевидное здесь, но может кто-то Array.from({length: 5}, (v, i) => i) шаг за шагом, почему Array.from({length: 5}, (v, i) => i) возвращает [0, 1, 2, 3, 4]?

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/from

Я не понял подробно, почему это работает

Ответ 1

Когда Javascript проверяет, можно ли вызвать метод, он использует утку. Это означает, что когда вы хотите вызвать метод foo из некоторого объекта, который должен иметь тип bar, он не проверяет, действительно ли этот объект является bar но проверяет, есть ли у него метод foo.

Так что в JS можно сделать следующее:

let fakeArray = {length:5};
fakeArray.length //5
let realArray = [1,2,3,4,5];
realArray.length //5

Первый из них похож на поддельный массив javascript (который имеет length свойства). Когда Array.from получает значение свойства length (в Array.from случае 5), он создает реальный массив длиной 5.

Этот тип объекта fakeArray часто называется arrayLike.

Вторая часть - это просто функция стрелки, которая заполняет массив значениями индексов (второй аргумент).

Эта техника очень полезна для насмешки какого-либо объекта для тестирования. Например:

let ourFileReader = {}
ourFileReader.result = "someResult"
//ourFileReader will mock real FileReader

Ответ 2

var arr1 = Array.from({
    length: 5 // Create 5 indexes with undefined values
  },
  function(v, k) { // Run a map function on said indexes using v(alue)[undefined] and k(ey)[0 to 4]
    return k; // Return k(ey) as value for this index
  }
);
console.log(arr1);

Ответ 3

На странице developer.mozilla.org о array.from никто не говорит нам, что mapFn может принимать 2 аргумента, например, v и k: v - значение текущего элемента, k - индекс элемента. Так что тут дело.

{length:5} создать объект без какого-либо значения, но с length равной 5;

(v, k) => k - функция стрелки, которая присваивает порядковый номер текущего элемента этому значению элемента.