前書き
JavaScriptのhttps://www.digitalocean.com/community/tutorials/understanding-data-types-in-javascript#arrays[Arrays]は、要素のリストで構成されています。 JavaScriptには、配列を操作するための便利な組み込みメソッドが多数あります。 元の配列を変更するメソッドは* mutator メソッドと呼ばれ、新しい値または表現を返すメソッドはhttps://www.digitalocean.com/community/tutorials/how-to-use-array-methods-として知られていますin-javascript-accessor-methods [ accessor * methods]。 このチュートリアルでは、ミューテーターメソッドに焦点を当てます。
このチュートリアルを最大限に活用するには、配列の作成、インデックス付け、変更、およびループ処理にある程度精通している必要があります。これについては、チュートリアルhttps://www.digitalocean.com/community/tutorials/understandingで確認できます。 -arrays-in-javascript [JavaScriptの配列について]。
配列はhttps://www.digitalocean.com/community/tutorials/how-to-index-split-and-manipulate-strings-in-javascript[strings]に似ており、両方ともインデックス番号からアクセスできます。 ただし、文字列は不変のデータ型であり、変更できないことを覚えておくことが重要です。 一方、配列は可変です。つまり、多くの配列メソッドは、配列のコピーではなく、元の配列に影響します。
このチュートリアルでは、要素の追加と削除、配列内の要素の反転、置換、その他の修正を行います。
isArray（）
ミューテーターメソッドに入る前に、オブジェクトが配列かどうかをテストするために `+ isArray（）`メソッドを見てみましょう。 これはhttps://www.digitalocean.com/community/tutorials/understanding-data-types-in-javascript#booleans[Boolean]メソッドで、変数の値が配列と等しい場合に ` true `を返します。 オブジェクトが配列でない場合、このメソッドは ` false`を返します。
let fish = [ "piranha", "barracuda", "koi", "eel" ];
// Test if fish variable is an array
Array.isArray(fish);Outputtrue`+ isArray（）`メソッドは便利です。なぜなら、テストに通常使用する ` typeof `演算子は、配列とともに使用すると ` object `を返し、オブジェクトと ` Array +`オブジェクトの違いを知っていることがあるためです。必要。
`+ isArray（）+`は、ほとんどの配列メソッドとは異なる方法で記述され、配列変数はメソッドの引数として提供されることに注意してください。
オブジェクトが配列であることを確認する方法を確認したので、ミューテーターメソッドに移りましょう。
ポップ（）
最初に説明するミューテーターメソッドは、配列の末尾から最後の要素を削除する `+ pop（）+`メソッドです。
「+ fish +」配列から始めます。
let fish = [ "piranha", "barracuda", "koi", "eel" ];最後のアイテムを削除するために、 `+ pop（）`メソッドを初期化しましょう。 この場合、文字列リテラル `" eel "+`になります。
// Use pop method to remove an item from the end of an array
fish.pop();配列を呼び出して、最後のアイテムなしで配列が返されるようにします。
fish;Output[ 'piranha', 'barracuda', 'koi' ]`+ fish `配列から `" eel "`を削除しました。 ` pop（）+`メソッドは追加のパラメーターを取りません。
シフト（）
別のミューテーターメソッドである `+ shift（）+`メソッドは、配列の先頭から最初の要素を削除します。
let fish = [ "piranha", "barracuda", "koi", "eel" ];`+ shift（）`を使用して、インデックス ` 0 `から `" piranha "+`を削除し、残りのすべての要素を1つのインデックス番号だけ下にシフトします。
// Use shift method to remove an item from the beginning of an array
fish.shift();
fish;Output[ 'barracuda', 'koi', 'eel' ]この例では、 `" piranha "`が削除され、各アイテムが1つのインデックス番号だけ下にシフトされています。 このため、他の配列要素はインデックスの位置を維持するため、可能な場合は常に `+ pop（）+`メソッドを使用することをお勧めします。
押す（）
`+ push（）+`ミューテーターメソッドは、配列の最後に新しい要素を追加します。
let fish = [ "piranha", "barracuda", "koi", "eel" ];最後にアイテムを追加するには、新しい要素を関数のパラメーターとして記述します。
// Use push method to add an item to the end of an array
fish.push("swordfish");
fish;Output[ 'piranha', 'barracuda', 'koi', 'eel', 'swordfish' ]複数の新しい値を配列に追加することもできます。 たとえば、 `+ fish.push（" swordfish "、" dragonfish "）`は、インデックス ` 4 `および ` 5 +`にアイテムを追加します。
unshift（）
`+ unshift（）+`ミューテーター配列メソッドは、配列の先頭に新しい要素を追加します。
let fish = [ "piranha", "barracuda", "koi", "eel" ];// Use unshift method to add an item to the beginning of an array
fish.unshift("shark");
fish;Output[ 'shark', 'piranha', 'barracuda', 'koi', 'eel' ]上記の例では、インデックス位置 `+ 0 `に `" shark "`が追加され、他のすべての配列要素が1つずつシフトされます。 ` shift（）+`と同様に、コンマで区切られた複数のアイテムを一度に配列に追加できます。
`+ pop（）`と ` push（）`は配列の終わりに影響を与え、 ` shift（）`と ` unshift（）`は配列の始まりに影響を与えます。 これを覚える簡単な方法は、 ` shift（）`と ` unshift（）+`が返される配列のすべてのインデックス番号を変更することを覚えておくことです
スプライス（）
`+ splice（）`メソッドは、配列内の任意の位置から項目を追加または削除できます。 ミューテーターメソッドである ` splice（）+`は、追加または削除、または追加と削除を同時に行うことができます。
`+ splice（）+`は、開始するインデックス番号、削除するアイテムの数、追加するアイテム（オプション）の3つのパラメーターを取ります。
splice(index number, number of items to remove, items to add)`+ splice（0、0、" new "）`は、文字列 `" new "+`を配列の先頭に追加し、何も削除しません。
`+ splice（）+`が配列内の項目を追加および削除する方法について、以下のいくつかの例を見てみましょう。
`+ splice（）+`で追加する
2番目のパラメーター（削除するアイテム）を `+ 0 `として設定すると、 ` splice（）`はゼロのアイテムを削除します。 この方法では、インデックス番号から始まるアイテムのみを追加することを選択でき、 ` splice（）`は、アイテムを追加するだけの ` push（）`または ` unshift（）+`よりも強力になります。配列の終わりまたは始まり。
let fish = [ "piranha", "barracuda", "koi", "eel" ];
// Splice a new item number into index position 1
fish.splice(1, 0, "manta ray");
fish;Output[ 'piranha', 'manta ray', 'barracuda', 'koi', 'eel' ]インデックス `+ 1 `から始まる新しい文字列 `" manta ray "+`が配列に追加されました。
`+ splice（）+`で削除する
3番目のパラメーター（追加するアイテム）を空白のままにすると、配列内の任意のポイントからアイテムを削除できます。
let fish = [ "piranha", "barracuda", "koi", "eel" ];
// Remove two items, starting at index position 1
fish.splice(1, 2);
fish;Output[ 'piranha', 'eel' ]インデックス + 1 +、 `" barracuda "`で始まる2つのアイテムを配列から削除しました。 2番目の引数が削除されると、配列の最後までのすべてのアイテムが削除されます。
`+ splice（）+`による追加と削除
すべてのパラメーターを一度に使用して、配列の項目を同時に追加および削除できます。
これを実証するために、上記と同じアイテムを削除し、それぞれの位置に新しいアイテムを追加しましょう。
let fish = [ "piranha", "barracuda", "koi", "eel" ];
// Remove two items and add one
fish.splice(1, 2, "manta ray");
fish;Output[ 'piranha', 'manta ray', 'eel' ]`+ splice（）`は、配列の任意の部分を変更するための強力な方法です。 ` splice（）`は、配列のセクションのコピーを作成するアクセサ配列である ` slice（）+`と混同しないように注意してください。
逆（）
`+ reverse（）+`メソッドは、配列内の要素の順序を逆にします。
let fish = [ "piranha", "barracuda", "koi", "eel" ];`+ reverse（）+`を使用すると、最後の要素が最初になり、最初の要素が最後になります。
// Reverse the fish array
fish.reverse();
fish;Output[ 'eel', 'koi', 'barracuda', 'piranha' ]`+ reverse（）+`配列メソッドにはパラメーターがありません。
fill（）
`+ fill（）+`メソッドは、配列内のすべての要素を静的な値に置き換えます。
let fish = [ "piranha", "barracuda", "koi", "eel" ];`+ fish `配列には、4つのアイテムがあります。 ` fill（）+`を適用しましょう。
// Replace all values in the array with "shark"
fish.fill("shark");
fish;Output[ 'shark', 'shark', 'shark', 'shark' ]配列内の4つのアイテムはすべて、同じ値 `" shark "`に置き換えられています。 `+ fill（）+`は、開始点と終了点のオプションの引数も取ります。
fish.fill("shark", 1) // > [ 'piranha', 'shark', 'shark', 'shark' ]
fish.fill("shark", 1, 3); // > [ 'piranha', 'shark', 'shark', 'eel' ]`+ fill（）+`を使用して、配列内の1つ以上の要素を静的な値に置き換えることができます。
ソート（）
`+ sort（）+`メソッドは、要素の最初の文字に基づいて配列内の要素をソートします。 最初の文字が同一である場合、それは行を続けて2番目の文字を比較し、以下同様に続きます。
デフォルトでは、 `+ sort（）+`はすべて大文字または小文字の文字列の配列をアルファベット順に並べます。
let fish = [ "piranha", "barracuda", "koi", "eel" ];
// Sort items in array
fish.sort();
fish;Output[ 'barracuda', 'eel', 'koi', 'piranha' ]`+ sort（）+`は最初のUnicode文字に基づいているため、大文字のアイテムを小文字の前にソートします。
元の配列を変更して、文字列の1つが大文字で始まるようにします。
let fish = [ "piranha", "barracuda", "Koi", "eel" ];
fish.sort();
fish;Output[ 'Koi', 'barracuda', 'eel', 'piranha' ]数字は大文字と小文字の両方の前に来ます。
配列を再度変更して、文字列項目の1つに数値を含めることができます。
let fish = [ "piranha", "barracuda", "Koi", "1 eel" ];
fish.sort();Output[ '1 eel', 'Koi', 'barracuda', 'piranha' ]デフォルトでは、 `+ sort（）+`はサイズで数値の配列をソートしません。 代わりに、数字の最初の文字のみをチェックします。
let numbers = [ 42, 23, 16, 15, 4, 8 ];
numbers.sort();Output[ 15, 16, 23, 4, 42, 8 ]数値を適切にソートするには、比較関数を引数として作成できます。
// Function to sort numbers by size
const sortNumerically = (a, b) => {
return a - b;
}
numbers.sort(sortNumerically);Output[ 4, 8, 15, 16, 23, 42 ]`+ sortNumerically `比較関数により、意図したとおりにソートできました。 ` sort（）+`は元の配列に変更を適用します。
結論
このチュートリアルでは、JavaScriptの主要なミューテーター配列メソッドを確認しました。 ミューテーターメソッドは、アクセサーメソッドのようにコピーを作成するのではなく、使用されている元の配列を変更します。 配列の先頭または末尾に要素を追加および削除する方法、および配列項目の値を並べ替える、逆にする、置き換える方法を学びました。
配列の基本を確認するには、https：//www.digitalocean.com/community/tutorials/understanding-arrays-in-javascript [JavaScriptの配列について]をお読みください。 すべての配列メソッドの完全なリストを表示するには、https：//developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array [Mozilla Developer Networkの配列リファレンス]を参照してください。