Learning to Code

プログラミング勉強記録

【JavaScript】 Array(配列)のメソッドまとめ

今まで学習した範囲でまとめ。

let fruits = ["Banana", "Orange", "Apple", "Mango"];

fruits.toString(); 
// 配列の要素を全て表示
// Banana,Orange,Apple,Mango
// toString()とわざわざメソッドをつけなくても同じ結果が返ってくる

Array.isArray(fruits); 
// 変数が配列であればtrueを返す
// true

fruits.join(" * "); 
// toStringと同じく配列の要素を表示するが区切り文字を指定できる
// Banana * Orange * Apple * Mango

fruits.pop(); 
// 配列の最後の要素を削除する(削除された要素を表示する)
// Mango
// fruits = Banana,Orange,Apple

fruits.push("Grape"); 
// 新たな要素を配列の最後に追加
// fruits[3] = "Grape"でも同じ結果が得られる

fruits; 
// Banana,Orange,Apple,Grape

fruits.shift(); 
// 配列の最初の要素を削除(削除された要素を表示)
// Banana

fruits; 
// Orange,Apple,Grape

fruits.unshift("Peach"); 
// 配列の最初に要素を追加する
// fruits = Peach,Orange,Apple,Grape

fruits[fruits.length] = "Kiwi";
// 配列の最後に要素を追加する
// fruits = Peach,Orange,Apple,Grape,Kiwi

fruits.splice(2, 0, "Lemon", "Strawberry"); 
// 最初のパラメータ(2)で追加する位置を、2番目のパラメータ(0)で削除する要素の数を、
// 3番目以降のパラメータで追加する要素を指定する。
// fruits = Peach,Orange,Lemon,Strawberry,Apple,Grape,Kiwi

fruits.splice(3);
// fruits = Peach,Orange,Lemon
// 配列の中から指定した数の要素のみ残す

fruits.splice(1, 2);
// fruits = Peach,Strawberry,Apple,Grape,Kiwi
// [1]~[2]の要素(この例ではOrangeとLemon)を消す

fruits.splice(1, 2, "Blueberry");
// fruits = Peach,Blueberry,Strawberry,Apple,Grape,Kiwi
// [1]~[2]の要素(この例ではOrangeとLemon)を消し、同じ位置に新要素を追加

let friends = ["Ros", "Chandler", "Joey"];

fruits.concat(friends);
// concat()で指定した変数と配列を連結できる。配列+配列はもちろん、配列+文字列も可能
// Peach,Orange,Lemon,Strawberry,Apple,Grape,Kiwi,Ros,Chandler,Joey;
// concat()は既存の配列を書き換えるのではなく新しい配列を返すので、
// fruitsの中身は変わらない
// fruits = Peach,Orange,Lemon,Strawberry,Apple,Grape,Kiwi

fruits.slice(3);
// slice()は指定したインデックスの位置以前の要素を配列から削除する
// Strawberry,Apple,Grape,Kiwi;
// slice()も既存の配列を書き換えるのではなく新しい配列を返す
// fruits = Peach,Orange,Lemon,Strawberry,Apple,Grape,Kiwi

fruits.slice(1, 4);
// slice(開始位置, 終了位置)で2つ要素を指定できる。この場合は4番目のAppleは
// 含まない。Orange, Lemon, Strawberry