JavaScriptの配列メソッド

JavaScriptの配列の力は配列メソッドに隠されています。

配列を文字列に変換します

JavaScriptメソッド toString() 配列を配列の値(カンマ区切り)の文字列に変換します。

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString(); 

結果

Banana,Orange,Apple,Mango

実際に試してみてください

join() 方法はすべての配列要素を1つの文字列に結合することもできます。

これはtoString()の動作に似ていますが、分隔符を指定することもできます:

インスタンス

var fruits = ["Banana", "Orange","Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.join(" * "); 

結果

Banana * Orange * Apple * Mango

実際に試してみてください

PoppingとPushing

配列を処理する際に、要素を削除したり新しい要素を追加したりすることがとても簡単です。

PoppingとPushingとは:

配列からプルッシュプロジェクト、または配列にプッシュプロジェクト。

Popping

pop() 方法は配列から最後の要素を削除します:

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop();              // fruitsから最後の要素("Mango")を削除します

実際に試してみてください

pop() 方法は「弹出された」値を返します:

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.pop();      // xの値は"Mango"です

実際に試してみてください

Pushing

push() 方法(配列の末尾に)新しい要素を配列に追加します:

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi");       // fruitsに新しい要素を追加します

実際に試してみてください

push() 方法は新しい配列の長さを返します:

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.push("Kiwi");   // xの値は5です

実際に試してみてください

位移要素

位移は弹出と同義ですが、最初の要素ではなく最後の要素を処理します。

shift() 方法は最初の配列要素を削除し、すべての他の要素をより低いインデックスに「位移」します。

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift();            // fruitsから最初の要素"Banana"を削除します

実際に試してみてください

shift() 方法返回被“位移出”的字符串:

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
メソッドは「移動された」文字列を返します:

実際に試してみてください

fruits.unshift("Lemon"); // fruitsに新しい要素"Lemon"を追加 fruits.shift(); // "Banana"を返します

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
メソッド(先頭に)は配列に新しい要素を追加し、古い要素を「反転移動」します:

実際に試してみてください

fruits.unshift("Lemon"); // fruitsに新しい要素"Lemon"を追加 unshift()

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
メソッドは新しい配列の長さを返します。

実際に試してみてください

を変更する

それらのインデックス番号を使用して配列要素にアクセスします:

配列索引(インデックス)0から始まります。[0]は最初の配列要素、[1]は第二、[2]は第三 ...

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[0] = "Kiwi";        // fruitsの最初の要素を"Kiwi"に変更

実際に試してみてください

length 属性が簡単に新しい要素を配列に追加する方法を提供します:

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Kiwi";          // fruitsに"Kiwi"を追加

実際に試してみてください

を使用して削除できます

JavaScriptの配列はオブジェクトであり、その要素はJavaScriptの属性 delete 演算子で削除

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
delete fruits[0];           // fruitsの中の最初の要素をundefinedに変更

実際に試してみてください

を使用して delete 配列に未定義の「空洞」を残します。splice()を使用してください。 pop() または shift() 取って代わります。

配列を結合

splice() メソッドは新しい要素を配列に追加するために使用できます:

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");

実際に試してみてください

新しい要素を追加する位置(結合)を定義する最初の引数(2)

削除すべき要素の数を定義する第二の引数(0)

残りの引数(「Lemon」、「Kiwi」)は追加する新しい要素を定義します。

splice() メソッドは削除されたアイテムを含む配列を返します:

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 2, "Lemon", "Kiwi");

実際に試してみてください

splice()を使用して要素を削除します

賢明な引数の設定で、splice()を使用して要素を削除できます splice() 要素を削除する際に配列に「空洞」を残さないように:

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(0, 1);        // fruitsの中の最初の要素を削除

実際に試してみてください

新しい要素がどこに追加されるべきかを定義する最初の引数(0)追加(接続)の場所。

第2引数(1)は削除すべき位置を定義します。複数の削除要素。

残りの引数が省略されました。新しい要素は追加されません。

結合(結びつけ)配列

concat() 方法は既存の配列を結合(結びつけ)して新しい配列を作成します:

例(2つの配列を結合)

var myGirls = ["Cecilie", "Lone"];
var myBoys = ["Emil", "Tobias", "Linus"];
var myChildren = myGirls.concat(myBoys);   // myGirls と myBoys を結合

実際に試してみてください

concat() 方法は既存の配列を変更しません。常に新しい配列を返します。

concat() 方法は任意の数の配列引数を使用できます:

例(3つの配列を結合)

var arr1 = ["Cecilie", "Lone"];
var arr2 = ["Emil", "Tobias", "Linus"];
var arr3 = ["Robin", "Morgan"];
var myChildren = arr1.concat(arr2, arr3);   // arr1、arr2 と arr3 を結合

実際に試してみてください

concat() 方法は引数として値も受け入れます:

例(配列と値を結合)

var arr1 = ["Cecilie", "Lone"];
var myChildren = arr1.concat(["Emil", "Tobias", "Linus"]); 

実際に試してみてください

配列の切り取り

slice() 方法は配列の一部を使って新しい配列を作成します。

本例では、配列の要素 1 ("Orange")から配列の一部を切り取ります:

インスタンス

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1); 

実際に試してみてください

slice() 方法は新しい配列を作成します。元の配列から要素は削除されません。

本例では、配列の要素 3 ("Apple")から配列の一部を切り取ります:

インスタンス

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(3); 

実際に試してみてください

slice() 2つの引数を受け入れます、例えば (1, 3)。

该方法会從開始引数を選択した要素から、終了引数(含まない)までを選択します。

インスタンス

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1, 3); 

実際に試してみてください

如果结束引数が省略された場合、例えば最初の例のように slice() 会切出数组的剩余部分。

インスタンス

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(2); 

実際に試してみてください

自動 toString()

元の値が必要な場合は、JavaScript が自動的に配列を文字列に変換します。以下の二つの例は同じ結果を生成します:

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString(); 

実際に試してみてください

インスタンス

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits; 

実際に試してみてください

すべての JavaScript オブジェクトは持っています toString() メソッド。

配列のソート

次の章で配列のソートについて学びます~。

配列内の最大と最小値を検索する

JavaScript 配列には、最高と最低の値を検索する内蔵関数はありません。

次の章でこの問題を解決する方法を学びます。

完全な配列リファレンス マニュアル

完全なリファレンス マニュアルが必要な場合は、私たちの完全な JavaScript 配列リファレンス マニュアル

このリファレンス マニュアルには、すべての配列属性とメソッドの説明と例が含まれています。