JavaScript 配列オブジェクト メソッドの分類 - 元の配列を変更するメソッド

注:実験段階のメソッドは含まれません

元の配列を変更するための Array オブジェクトのメソッドのリスト

解釈: 配列オブジェクトは、このクラス メソッドを呼び出すことによって、それ自体の内容を変更します。

方法	説明
copyWithin()	配列内の指定された位置から配列内の別の指定された位置に要素をコピーします。
塗りつぶし（）	配列の要素を固定値に置き換えます。
ポップ（）	配列の最後の要素を削除し、削除された要素を返します。
押す（）	配列の末尾に 1 つ以上の要素を追加し、新しい長さを返します。
逆行する（）	配列内の要素の順序を逆にします。
シフト（）	配列から最初の要素を削除し、最初の要素の値を返します。
選別（）	配列の要素を並べ替えます。
スプライス（）	配列の要素を追加または削除します。
アンシフト()	配列の先頭に 1 つ以上の要素を追加し、新しい長さを返します。

元の配列を変更するための Array オブジェクトのメソッドの使用法

copyWithin()

メソッド 配列の一部を同じ配列内の別の場所に浅拷贝移動し、元の配列の長さを変更せずにそれを返します。

浅いコピー: 浅いコピーでは、オブジェクト自体ではなくオブジェクトへのポインターのみがコピーされ、古いオブジェクトと新しいオブジェクトは同じストレージ スペースを共有します。
ディープ コピー: ディープ コピーは同一のオブジェクトを作成します. 新しいオブジェクトは元のオブジェクトと同じストレージ スペースを使用しません. 新しいオブジェクトを変更しても元のオブジェクトは変更されません.

文法

copyWithin(ターゲット)
copyWithin(ターゲット、開始)
copyWithin(ターゲット、開始、終了)

パラメータ

名前	タイプ	説明
目標	整数	Required、インデックスは 0 から始まり、シーケンスはこの位置にコピーされます。負の場合、ターゲットは最後からカウントされます。target が arr.length 以上の場合、コピーは行われません。target が start の後にある場合、コピーされたシーケンスは arr.length に合うように変更されます。
始める	整数	オプションで、インデックスはコピーされた要素の開始位置である 0 から始まります。負の場合、start は最後からカウントされます。start を省略すると、copyWithin はゼロからコピーを開始します。
終わり	整数	オプション、インデックスは 0 から始まり、要素の終了位置のコピーを開始します。copyWithin はこの位置にコピーしますが、位置 end の要素は含みません。負の場合、 end は最後から数えます。end を省略した場合、copyWithin メソッドは配列の最後までコピーします (デフォルトは arr.length です)。

戻り値

変更された配列。

例

[1, 2, 3, 4, 5, 6, 7, 8].copyWithin(2);
// [1, 2, 1, 2, 3, 4, 5, 6]
[1, 2, 3, 4, 5, 6, 7, 8].copyWithin(1,3);
// [1, 4, 5, 6, 7, 8, 7, 8]
[1, 2, 3, 4, 5, 6, 7, 8].copyWithin(0,3,4);
// [4, 2, 3, 4, 5, 6, 7, 8]

塗りつぶし（）

メソッドは、配列内の開始インデックスから終了インデックスまでのすべての要素を固定値で埋めます。終了インデックスは含まれません。

文法

fill(値)
fill(値, 開始)
fill(値, 開始, 終了)

パラメータ

名前	タイプ	説明
価値	いかなるタイプ	必須, 配列要素の値を埋めるために使用されます. fill のパラメータが参照型の場合, 同じ参照型が実行されることに注意してください.
始める	整数	必須、開始インデックス、デフォルト値は 0 です。負の値の場合は、末尾から数えることを意味します。
終わり	整数	必須、終了インデックス、デフォルト値は this.length です。負の値の場合は、末尾から数えることを意味します。

戻り値

変更された配列。

例

[1, 2, 3, 4, 5, 6, 7, 8].fill(2);
// [2, 2, 2, 2, 2, 2, 2, 2]
[1, 2, 3, 4, 5, 6, 7, 8].fill(2,3);
// [1, 2, 3, 2, 2, 2, 2, 2]
[1, 2, 3, 4, 5, 6, 7, 8].fill(2,3,5);
// [1, 2, 3, 2, 2, 6, 7, 8]

const arr = Array(3).fill({
    
    a:1}); // arr:[{}, {}, {}]
arr[0].a = "b"; // arr:[{a:"b"}, {a:"b"}, {a:"b"}]

ポップ（）

メソッドは、配列から最後の要素を削除し、その要素の値を返します。

文法

arr.pop()

パラメータ

名前	タイプ	説明
なし	なし	なし

戻り値

配列から削除する要素。配列が空の場合は undefined を返します。

例

const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.pop(); // 8
// arr:[1, 2, 3, 4, 5, 6, 7]

押す（）

メソッドは、配列の末尾に 1 つ以上の要素を追加し、配列の新しい長さを返します。

文法

arr.push(要素1, …, 要素N)

パラメータ

名前	タイプ	説明
要素N	いかなるタイプ	オプション、配列の末尾に追加される要素。

戻り値

新しい長さ属性値。

例

const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.push(); // 8
// arr:[1, 2, 3, 4, 5, 6, 7, 8]
arr.push(9); // 9
// arr:[1, 2, 3, 4, 5, 6, 7, 8, 9]
arr.push(10, 11); // 11
// arr:[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]

逆行する（）

メソッドは、配列内の要素の位置を逆にして、配列を返します。配列の最初の要素が最後になり、配列の最後の要素が最初になります。

文法

arr.reverse()

パラメータ

名前	タイプ	説明
なし	なし	なし

戻り値

逆配列。

例

const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.reverse();
// arr:[8, 7, 6, 5, 4, 3, 2, 1]

シフト（）

メソッドは、配列から最初の要素を削除し、その要素の値を返します。

文法

arr.shift()

パラメータ

名前	タイプ	説明
なし	なし	なし

戻り値

配列から削除する要素。配列が空の場合は undefined を返します。

例

const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.shift(); // 1
// arr:[2, 3, 4, 5, 6, 7, 8]

選別（）

このメソッドは、配列のすべての要素をその場でソートし、配列を返します。ソートは必ずしも安定（安定）しているとは限りません。デフォルトのソート順は、文字列の Unicode エンコード位置 (コード ポイント) に基づいています。実行環境の実装に依存するため、ソートの時間と空間の複雑さは保証できません。

文法

arr.sort([compareFunction])

パラメータ

名前	タイプ	説明
比較関数	関数	オプション。ある順序でソートする関数を指定するために使用されます。省略した場合、要素は、変換された文字列の各文字の Unicode 位置によって並べ替えられます。

説明します:

compareFunction が指定されていない場合、要素は、変換された文字列の文字の Unicode ポイントによって並べ替えられます。たとえば、「バナナ」は「チェリー」の前にソートされます。数値を小さい順に並べると、80より9が先になります。compareFunctionが指定されているため、比較した数値が先に文字列に変換されるため、Unicode順では「80」が「9」よりも前になります。
compareFunction が指定されている場合、配列は関数の呼び出しによって返された値でソートされます。つまり、a と b が比較対象の 2 つの要素です。

• compareFunction(a, b) が 0 未満の場合、a は b の前に配置されます。
• compareFunction(a, b) が 0 に等しい場合、a と b の相対位置は変更されません。注: この動作は ECMAScript 標準では保証されておらず、すべてのブラウザーが準拠しているわけではありません (例: Mozilla 2003 より前のバージョン)。
• compareFunction(a, b) が 0 より大きい場合、b は a の前にソートされます。
• compareFunction(a, b) は常に同じ入力に対して同じ比較結果を返す必要があります。そうでない場合、並べ替えの結果は未定義になります。

戻り値

ソートされた配列。

例

const arr = [1, 3, 5, 2, 4, 8, 7, 6];
arr.sort(); // [1, 2, 3, 4, 5, 6, 7, 8]
// arr:[1, 2, 3, 4, 5, 6, 7, 8]

const arr1 = [1, 3, 2, "a", "b", "A", "B"];
arr1.sort(); // [1, 2, 3, 'A', 'B', 'a', 'b']
// arr1:[1, 2, 3, 'A', 'B', 'a', 'b']

const arr2 = [1, 3, 5, 2, 4, 8, 7, 6];
arr2.sort(function(a, b) {
    
    
  return b - a;
}); // [8, 7, 6, 5, 4, 3, 2, 1]
// arr2:[8, 7, 6, 5, 4, 3, 2, 1]

スプライス（）

このメソッドは、既存の要素を削除または置換するか、新しい要素を所定の位置に追加することによって配列を変更し、変更されたコンテンツを配列として返します。

文法

splice(start)
splice(start, deleteCount)
splice(start, deleteCount, item1)
splice(start, deleteCount, item1, item2, …, itemN)

パラメータ

名前	タイプ	説明
始める	整数	必須。変更の開始位置を指定します (0 から数えます)。配列の長さを超えた場合は配列の末尾から内容を追加し、負の値の場合は配列の末尾からの数を示します（-1から数えて-nが最後） n 番目の要素などは array.length-n と等しい); 負の数の絶対値が配列の長さより大きい場合、開始位置が 0 番目の位置であることを意味します。
削除数	整数	オプション、削除する配列要素の数。deleteCount を省略した場合、またはその値が array.length - start 以上の場合 (つまり、start の後のすべての要素の数以上の場合)、start の後の配列のすべての要素は、削除されました。deleteCount が 0 または負の場合、要素は削除されません。この場合、少なくとも 1 つの新しい要素を追加する必要があります。
アイテム1、アイテム2、…	いかなるタイプ	オプションで、開始位置から始まる、配列に追加される要素。指定しない場合、 splice() は配列要素のみを削除します。

戻り値

削除された要素の配列を返します。要素が 1 つだけ削除された場合は、要素を 1 つだけ含む配列を返します。要素が削除されていない場合は、空の配列を返します。

例

const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.splice(3); // [4, 5, 6, 7, 8]
// arr:[1, 2, 3]

const arr1 = [1, 2, 3, 4, 5, 6, 7, 8];
arr1.splice(3, 2); // [4, 5]
// arr1:[1, 2, 3, 6, 7, 8]

const arr2 = [1, 2, 3, 4, 5, 6, 7, 8];
arr2.splice(3, 2, "true", "false"); // [4, 5]
// arr2:[1, 2, 3, 'true', 'false', 6, 7, 8]

アンシフト()

メソッドは、配列の先頭に 1 つ以上の要素を追加し、配列の新しい長さを返します。

文法

arr.unshift(要素1, …, 要素N)

パラメータ

名前	タイプ	説明
要素N	いかなるタイプ	Optional、配列の先頭に追加する 1 つまたは複数の要素。

戻り値

新しい長さ属性値。

例

const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.unshift("true", "false"); // 10
// arr:['true', 'false', 1, 2, 3, 4, 5, 6, 7, 8]

参考文献:
1.「配列 - JavaScript | MDN」;
2.「JavaScript 配列オブジェクト | 初心者向けチュートリアル」;
3.「JavaScript 配列」 -- W3School;