JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptで配列を空にする3つの方法【サンプルコード付きで解説】

JavaScriptで配列を空にする方法はいくつかあります。それぞれ挙動や注意点が異なるため、状況に応じて適切な方法を選ぶことが大切です。

まず、例として次のような配列を用意します。

var array1 = [1,2,3,4,5,6,7];

方法1：新しい空の配列を代入する

array1 = [];

このコードは、変数array1に新しい空の配列を代入することで、配列を空にします。

この方法がおすすめなのは、元の配列への参照が他に存在しない場合です。ただし注意が必要で、もし別の変数から同じ配列を参照していた場合、その参照先の配列は空にならず、元のデータがそのまま残ってしまいます。

サンプルコード

<html>
<body>
<script>
   var array1 = [1,2,3,4,5,6,7];   // 配列を作成
   var anotherArray = array1;      // 別の変数でarray1を参照
   array1 = [];                    // 配列を空にする
   document.write(anotherArray);   // 出力結果：[1,2,3,4,5,6,7]
</script>
</body>
</html>

上記の例では、anotherArrayには依然として元の配列 [1,2,3,4,5,6,7] が参照されたままになっていることがわかります。

方法2：lengthプロパティを0にする

array1.length = 0;

このコードは、配列のlengthプロパティを0に設定することで、元の配列そのものを空にします。配列の実体が直接変更されるため、他の変数からの参照もすべて空の配列になります。

サンプルコード

<html>
<body>
<script>
   var array1 = [1,2,3,4,5,6,7]; // 配列を作成
   var anotherArray = array1;    // 別の変数でarray1を参照
   array1.length = 0;            // lengthを0にして配列を空にする
   console.log(anotherArray);    // 出力結果：[]
</script>
</body>
</html>

方法3：splice()メソッドを使う

array1.splice(0, array1.length);

splice()メソッドを使い、配列の先頭（インデックス0）から末尾までの全要素を削除する方法です。こちらも配列の実体を直接変更するため、元の配列へのすべての参照が更新されます。

サンプルコード

<html>
<body>
<script>
   var array1 = [1,2,3,4,5,6,7];    // 配列を作成
   var anotherArray = array1;       // 別の変数でarray1を参照
   array1.splice(0, array1.length); // 全要素を削除して配列を空にする
   console.log(anotherArray);       // 出力結果：[]
</script>
</body>
</html>

まとめ：使い分けのポイント

配列を空にする主な方法は以下の3つです。

  • 新しい空の配列を代入（array1 = []）：最もシンプルだが、他の変数からの参照は元の配列のまま残る
  • lengthを0にする（array1.length = 0）：元の配列自体が空になり、すべての参照に反映される
  • splice()を使う（array1.splice(0, array1.length)）：全要素を削除し、すべての参照に反映される

配列を他の変数と共有している場合は「方法2」または「方法3」を使うのが安全です。単独で扱う配列であれば、最も簡潔に書ける「方法1」で十分でしょう。

  1. JavaScriptで配列を空にする4つの方法【サンプルコード付きで解説】

    JavaScriptで配列を空にする方法は、主に4つあります。それぞれ動作の仕組みや特徴が異なるため、目的に応じて適切な方法を選ぶことが大切です。配列を空にする4つの方法新しい空の配列を代入する：配列変数に、新しく作成した空の配列を代入します。最もシンプルな方法ですが、元の配列を参照している他の変数が残る点には注意が必要です。lengthプロパティを使う：配列のlengthプロパティに0を設定するだけで、すべての要素を削除できます。高速で、元の配列への参照も維持されるため、実務で最もよく使われる方法のひとつです。popメソッドを使う：配列の要素数が0になるまで、popメソッドで末尾の要素を繰り

  2. JavaScriptでnull・空のオブジェクトを含む配列に値を割り当てる方法

    JavaScriptでは、forEach()メソッドとObject.keys()メソッドを組み合わせることで、nullや空のオブジェクトを含む配列に対して効率的に値を割り当てることができます。本記事では、実際のコード例を交えながら、その具体的な実装方法をわかりやすく解説します。 サンプルコード 以下は、JavaScriptを使用してnull/空のオブジェクトを持つ配列に値を割り当てるコード例です。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&qu