JavaScript で配列を空にする方法

Kirill Ibrahim 2023年10月12日

JavaScript JavaScript Array

配列は、便利なインデックス付きの集合に格納された項目の集合です。乗算項目を含む配列を空にしたい場合はどうすればいいのでしょうか？

このチュートリアルでは、JavaScript で配列を空にする方法のさまざまな方法を紹介します。

配列をサイズゼロの新しい配列に設定する

これが最速の方法です。これで配列を新しい空の配列にします。

let Arr = [1, 2, 3, 4];
Arr = [];

他の場所から元の配列への参照がない場合には、これがストレートです。そうするとこれらの参照は更新されず、それらの場所は古い配列を使い続けます。これは、以前の配列の内容への参照がまだメモリに残っていることを意味し、メモリリークにつながります。

これは、配列を元の変数 Arr で参照している場合にのみ使用してください。

以下のコード例は、このメソッドを使用した場合に発生する可能性のある問題を示しています。

let Arr1 = [1, 2, 3, 4, 5, 6];
let Arr2 = Arr1;
Arr1 = [];
console.log({Arr1, Arr2});

出力：

{
  Arr1: [],
  Arr2: [1, 2, 3, 4, 5, 6]
}

配列の長さを 0 に設定することで、既存の配列をクリアします。配列の length プロパティは読み書き可能なプロパティなので、ECMAScript 5 の strict モードを使用しても動作します。

Arr1.length = 0

この方法には、配列内のすべてを削除するという利点がありますが、他の参照にも影響を与えます。同じ配列への参照が 2つある場合、Arr1.length = 0 を使用して配列の内容を削除すると、両方の参照は同じ空の配列を指すようになります。

let foo1 = [1, 2, 3];
let bar1 = [1, 2, 3];
let foo2 = foo1;
let bar2 = bar1;
foo1 = [];
bar1.length = 0;
console.log({foo1, bar1, foo2, bar2});

出力：

{
  bar1: [],
  bar2: [circular object Array],
  foo1: [],
  foo2: [1, 2, 3]
}

メソッド array.splice() は JavaScript に組み込まれたメソッドであり、配列に項目を追加したり削除したりして、削除した項目を返すために利用されます。

let Arr1 = ['Tomato', 'Letcuce', 'Spinash', 'Cucumber'];
Arr1.splice(2, 0, 'Lemon', 'Kiwi')
console.log(Arr1);

出力：

["Tomato", "Letcuce", "Lemon", "Kiwi", "Spinash", "Cucumber"]

配列を空にします。

Arr1.splice(0, Arr1.length);
console.log(Arr1);

出力：

[]

配列からすべての要素を削除し、元の配列をきれいにします。

pop() メソッドは配列から最後の要素を削除し、その要素を返します。また、配列の長さを変更します。

let vegetables = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'];

console.log(vegetables.pop());

console.log(vegetables);

出力：

tomato
(4) ["broccoli", "cauliflower", "cabbage", "kale"]

配列をループさせ、ループするたびに配列の要素をポップし、最後に空の配列を取得します。

let Arr1 = [1, 2, 3, 4, 5];
for (let i = Arr1.length; i > 0; i--) {
  Arr1.pop();
}
console.log(Arr1);

出力：

[]

この解決策はあまり簡潔ではありませんし、最も遅い解決策でもあります。