为什么 Array.from() 返回未定义的第一个元素？

Question

当我这样做时

const arrayLike = { 1:'foo', 2:'bar', length:2 };
Array.from(arrayLike);

我明白了

[ undefined, 'foo' ]

当我这样做时

const arrayLike = { 1:'foo', 2:'bar', length:3 };
Array.from(arrayLike)

我明白了

[ undefined, 'foo', 'bar' ]

• 为什么我设置长度时看不到bar？
• 为什么只有在将长度硬设置为 3 时才能看到我的元素？
• 为什么第一个元素显示为undefined？

Answer 1

数组在 JavaScript 中被 0 索引

所有这些问题都得到了非常简单的回答。 Array.from 假设您给它的类似数组的对象是零索引的。如果不是，您将获得一个零索引的数组，其中包含所有未设置的元素，包括将0 设置为undefined。所以在你的例子中，

const arrayLike = { 1:'foo', 2:'bar', length:2 };
Array.from(arrayLike);

本质上是一样的，

const arrayLike = { 0:undefined, 1:'foo', 2:'bar', length:2 };
Array.from(arrayLike);

因为长度小于最大元素，它基本上停止在该点迭代，并且错误长度起到截断的作用。你想要的很可能，

const arrayLike = { 0:'foo', 1:'bar', length:2 };
Array.from(arrayLike);

或者，如果您从 1 索引的源获取类似数组，请适当设置 length 以免丢失最后一个元素，然后从结果中删除第一个元素（相当于 @ 987654329@)。

const arrayLike = { 1:'foo', 2:'bar', length:3 };

let arr = Array.from(arrayLike).splice(1);

let arr = Array.from(arrayLike);
arr.shift();


let [, ...arr] = Array.from(arrayLike);

Answer 2

Array.from(obj) 不返回 undefined，它使用来自给定类数组对象 obj 的属性返回一个新数组。

并且未给定时创建的每个索引位置的默认值是未定义的。

您看到的undefined 值位于已创建数组的索引0。

无论如何，这不是问题，您仍然可以访问索引1 和2，它们将返回您期望它们返回的值。

您还可以使用以下方法验证已创建数组的默认行为：

console.log(new Array(10))

哪些日志（索引位置0..9）（长度10）：

[undefined x 10]

在 JavaScript 中，除了0 之外，您不会看到任何具有第一个索引的数组。独立于数组的创建方式。

---

您正在做的另一种选择是设置 原型：

const arrayLike = { 1:'foo', 7:'bar' };

//Dynamic set the length
arrayLike.length = Math.max(...Object.keys(arrayLike)) + 1;

//Get built-in features of Array to your arrayLike
Object.setPrototypeOf(arrayLike, Array.prototype);

//Do something
arrayLike.forEach((x, i) => console.log("%i: %s", i, x))