使用空元素迭代数组（ES6）

Question

我有一个指定长度的数组，我想要填充它的值取决于每个索引。

let arr = new Array(someLength)
arr.map((v, i) => i * 2)

据我所知，这不起作用是因为map 跳过未定义的值。

我有几个问题：

1. Why does map work on something like [undefined, undefined]?

2. Is there anyway to accomplish this using ES6 array methods?

   I know I can use a standard for loop, but was wondering if there's a nicer way to do it.

   for (let i = 0; i < arr.length; i++) { 
      arr[i] = i * 2 
   }
   

   I've found one method so far, it's not really clean though.

   arr = arr.fill(undefined).map((foo, i) => i * 2)
   

- mdn

---

你尝试过使用every()函数吗？ - GMaiolo

.map() 不会跳过未定义的值；它会跳过未定义的属性/成员。 - user1106925

[...Array(someLength)].map((_, i) => i * 2) 是另一种可能性。 - user1106925

更准确地说，“map” 跳过缺失的元素或空洞。顺便说一下，不需要使用“fill(undefined)”这样的表达方式——只用“fill()”就可以了。 - user663031

可能是Javascript Array map“似乎”在缺少的元素上执行回调和JavaScript“new Array(n)”和“Array.prototype.map”的怪异行为的重复问题。 - Oriol

Answer 1

1. .map 为什么可以用于类似 [undefined, undefined] 这样的数组？

考虑以下两种情况：

let a1 = [];
a1.length = 2;
a1; // [undefined × 2]

// vs

let a2 = [undefined, undefined];
a2; // [undefined, undefined]

Object.keys 在这些情况下的结果会是什么？

Object.keys(a1); // []
Object.keys(a2); // ["0", "1"]

因此，我们可以看到两者之间的区别-一个初始化了键，另一个没有

---

2. 是否有任何方法可以使用ES6数组方法完成这个操作?

你已经指出了 .fill，你也可以使用 Array.from

Array.from({length: 5}, (itm, idx) => 2 * idx); // [0, 2, 4, 6, 8]

- Paul S.

---

我认为你应该将最后一个语句改为使用原始的arr数组。 - Morteza Tourani

Answer 2

你可以生成一个由 undefined 值组成的数组。

Array.apply(null, {length: 5})

并将其用于映射。

var array = Array.apply(null, {length: 5});
console.log(array);

array = array.map((_, i) => 2 * i);
console.log(array);

- Nina Scholz

---

如果您将var array = Array.apply(...更改为var array =[]; array.length = 5;，那么您会发现它无法正常工作。 - Morteza Tourani

@mortezaT，没错。但我使用上述代码时没有稀疏元素。 - Nina Scholz

Answer 3

你只需要用0填充数组。然后你可以像这样使用map或forEach进行处理：

var arr = new Array(5); //[,,,,,]
arr.fill(0).forEach((v, i, tab) => {tab[i] = i * 2}); // [ 0, 2, 4, 6, 8 ]

- kevin ternet