Nの勉強日記22：配列は動かして覚える！push・pop・splice | 【公式】Crebitプログラミング教室

前回のブログでは、配列についてお話しました。
今回は配列要素を変更する関数についてお話します。

要素の追加

① push関数
【文法】配列名.push（追加する値,・・追加する値）;
配列の最後に要素を追加する

let fruits = [“りんご”, “みかん”];
fruits.push(“バナナ”);

console.log(fruits);
// [“りんご”, “みかん”, “バナナ”]

・複数の値を一度に追加することもできます
fruits.push(“ぶどう”, “もも”);

・元の配列が直接変更される 点に注意しましょう。

② splice関数
【文法】配列名.splice(開始位置, 削除個数, 追加する値,・・追加する値);
splice は 追加・削除・置き換えができる便利な関数 です。

・開始位置に追加する場合
削除個数を 0 にします。

let numbers = [1, 2, 4];
numbers.splice(2, 0, 3);

console.log(numbers);
// [1, 2, 3, 4]
👉 「2番目の位置に、何も削除せず、3を追加する」という意味です。

・要素を置き換える場合
削除個数を 1 以上にします。

let colors = [“赤”, “青”, “緑”];
colors.splice(1, 1, “黄色”);

console.log(colors);
// [“赤”, “黄色”, “緑”]
👉 「青」を削除して、「黄色」に置き換えています。

③ unshift関数
・配列の先頭に追加 します。

days.unshift(“日”);

console.log(days);
// [“日”, “火”, “水”]

① pop関数
【文法】配列名.pop();
・配列の最後の要素を1 つだけ削除します。

let animals = [“犬”, “猫”, “うさぎ”];
animals.pop();

console.log(animals);
// [“犬”, “猫”]

・削除された要素は 戻り値として取得できます

let removed = animals.pop();
console.log(removed); // 猫
👉 「猫」が削除され、戻り値としてremovedに入る

② splice関数
【文法】配列名.splice(開始位置, 削除個数);
・開始位置から削除するときに使います。

let scores = [10, 20, 30, 40];
scores.splice(1, 2);

console.log(scores);
// [10, 40]
👉 「20 と 30」を削除しています。

③ shift関数
・配列の先頭を削除 します。

let days = [“月”, “火”, “水”];
days.shift();

console.log(days);
// [“火”, “水”]

配列の要素を変更するには、さまざまな関数があります。
一度にすべて覚えようとせず、少しずつ理解していきましょう。