„Array.prototype.fill() verwendet Objekte, um Referenzen zu übergeben, anstatt neue Instanzen zu erstellen'

Question

Ich habe ein bisschen herumgespielt und versucht, ein neues Array der Länge x zu instanziieren, wobei alle Elemente des Arrays auf den Wert y initialisiert wurden: < /p>

var arr = new Array(x).fill(y);

Diese Methode funktioniert gut, wenn der Wert von y kein Objekt ist. Das heißt, wenn y ein Objekt ist, dann sind die folgenden Bedingungen wahr:

var arr = new Array(2).fill({});
arr[0] === arr[1]; //Das Ergebnis ist wahr;
arr[0].test = 'string';
arr[1].test === 'string'; //Das Ergebnis ist auch wahr;

Gibt es eine Möglichkeit zu deklarieren, dass bei Verwendung der Füllfunktion für jedes Element ein neues Objekt erstellt werden soll? Oder sollte ich es in eine Schleife umwandeln?

Answer 1

接受的答案很好，在90%的情况下都能工作。

但是，如果你正在制作高性能的JS应用程序，并且使用大型/巨大的数组，Array.map(..)会在内存和处理器使用方面创建大量的负载，因为它会创建数组的副本。

我建议使用经典的for循环：

a = new Array(ARRAY_SIZE);
    for (var i = 0; i < ARRAY_SIZE; i++) {
        a[i] = [];
    }
    // 或者使用一行代码的替代方案
    for (var i = 0, a = []; i < ARRAY_SIZE; a[i++] = []);

我测试了六种替代方案，得到了以下结果：

• Array.map()，如上所述（比原来慢11倍！）：

  a = new Array(ARRAY_SIZE).fill().map(u => { return []; });

• for循环，最好的选择（最快）：

  // 标准的多行方式
   a = new Array(ARRAY_SIZE);
   for (var i = 0; i < ARRAY_SIZE; i++) {
       a[i] = [];
   }
  
   // 一行语法
   for (var i = 0, a = []; i < ARRAY_SIZE; a[i++] = []);

• forEach（慢6倍）：

  a = new Array(ARRAY_SIZE).fill();
   a.forEach((val, i) => {
       a[i] = [];
   })

[更新于2020-08-27] Ilias Karim提出了另一种方法

• Array.from（慢30倍！）- 在性能方面显然更差，尽管语法最好 :(

  a = Array.from({ length: ARRAY_SIZE }, () => []);

• [..Array(..)]（慢5倍！）

  a = [...Array(ARRAY_SIZE)].map(_=>([]))

• Array.push(..)，在性能方面排名第二（慢2倍！）

  let a = [], total = ARRAY_SIZE;
   while(total--) a.push([]);

附注：我在这个fiddle上进行了测试。

Answer 2

您可以首先使用任何值（例如undefined）填充数组，然后您就可以使用map：

var arr = new Array(2).fill().map(u => ({}));

var arr = new Array(2).fill().map(Object);