在为其索引赋值之前声明数组的长度是否更有效？

Question

在赋值之前设置数组的长度有什么好处吗？

例如,

let arr = [];
arr.length = 10;
arr[0] = 'a'; // arr.length === 10
...
arr[9] = 'i'; // arr.length === 10

甚至

let arr = new Array(10);
arr[0] = 'a'; // arr.length === 10
...
arr[9] = 'i'; // arr.length === 10

与

let arr = [];
arr[0] = 'a'; // arr.length === 1
arr[1] = 'b'; // arr.length === 2
...
arr[9] = 'i'; // arr.length === 10

Answer 1

至少在V8中,它似乎new Array(length)比替代品快得多,至少一个数量级.包括push方法只是为了好玩:

(警告:运行以下代码会阻止浏览器一点)

const t0 = performance.now();
for (let i = 0; i < 2e6; i++) {
  const arr = [];
  arr.length = 7;
  arr[0] = 'a';
  arr[1] = 'b';
  arr[2] = 'c'
  arr[3] = 'd'
  arr[4] = 'e'
  arr[5] = 'f';
  arr[6] = 'g';
}
const t1 = performance.now();
for (let i = 0; i < 2e6; i++) {
  const arr = new Array(7);
  arr[0] = 'a';
  arr[1] = 'b';
  arr[2] = 'c'
  arr[3] = 'd'
  arr[4] = 'e'
  arr[5] = 'f';
  arr[6] = 'g';
}
const t2 = performance.now();
for (let i = 0; i < 2e6; i++) {
  const arr = [];
  arr[0] = 'a';
  arr[1] = 'b';
  arr[2] = 'c'
  arr[3] = 'd'
  arr[4] = 'e'
  arr[5] = 'f';
  arr[6] = 'g';
}
const t3 = performance.now();
for (let i = 0; i < 2e6; i++) {
  const arr = [];
  arr.push('a');
  arr.push('b');
  arr.push('c');
  arr.push('d');
  arr.push('e');
  arr.push('f');
  arr.push('g');
}
const t4 = performance.now();

console.log('arr.length = length', t1 - t0);
console.log('new Array(length)', t2 - t1);
console.log('arr = [] only', t3 - t2);
console.log('push only', t4 - t3);

Firefox上的差异不那么令人印象深刻,但它仍然存在 - new Array(length)似乎是其他可能性的两倍.你可能会这么认为

const arr = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];

甚至会更有效,这是真实的FF(按数量另一对夫妇的订单),但它似乎是大致相同的new Array(length)V8中:

const t0 = performance.now();
for (let i = 0; i < 2e8; i++) {
  const arr = new Array(7);
  arr[0] = 'a';
  arr[1] = 'b';
  arr[2] = 'c'
  arr[3] = 'd'
  arr[4] = 'e'
  arr[5] = 'f';
  arr[6] = 'g';
}
const t1 = performance.now();
for (let i = 0; i < 2e8; i++) {
  const arr = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];
}
const t2 = performance.now();

console.log('new Array(length)', t1 - t0);
console.log(`arr = ['a', 'b', ...]`, t2 - t1);