魔法JS☆あれい 第1話「popでpushした、ような……」

登場人物

丹生（にゅう）あれい
魔法少女「魔法（マジカル）JS（女子小学生）☆あれい」として活動中。

イテレー太
正体不明の魔法生物。

目次

第1部「ミューテーター・メソッド編」
* 第1話「popでpushした、ような……」
* 第2話「shiftはとってもunshiftって」
* 第3話「もうsortもreverseも怖くない」
* 第4話「fillも、spliceも、copyWithinもあるんだよ」

第2部「アクセサ・メソッド編」
* 第5話「joinなんて、concatなわけない」
* 第6話「indexOfなの絶対lastIndexOf」
* 第7話「includesのsliceと向き合えますか？」

第3部「イテレーション・メソッド編」
* 第8話「filterって、ほんとfindとfindIndex」
* 第9話「someなの、everyが許さない」
* 第10話「もうmapにもforEachにも頼らない」
* 第11話「最後に残ったreduceとreduceRight」
* 最終話「flatの、最高のflatMap」

pop()

イテレー太「あれい、すべての前置きを端折るけど、今戦闘の真っ最中だよ！」
あれい「楽してんじゃねえよこの駄犬が」
イ「犬じゃなくてイテレータ型魔法生物だよ！　そして敵を倒すにはあれいの配列魔法が必要なんだ！」
あ「人の話を聞けこの雑種」
イ「僕が魔法世界から召喚したデータを、あれいの配列魔法を使って、敵の弱点に合わせた値に変換してreturnする事で、ダメージを与えることができるんだ！」
あ「なら最初からまともなデータを用意しろよポンコツ」
イ「さて、今回僕が召喚したデータは……これだよ！」

items = ['羽二重餅', '水ようかん', '梅月せんべい'];

あ「……それ、全部福井の銘菓じゃねえか。相変わらず福井県民丸出しだな」
イ「そして、今回の敵の弱点は、『配列の最後の要素』だよ！　さあ、配列の最後の要素をreturnしてぶつけるんだ！」
あ「だから最後の要素だけ召喚しろっつってんだろこのボロ雑巾」
イ「頼んだよ！　あれい！」
あ「面倒くせえなあ……」

return items.pop();

イ「おおっ！　やったよ、あれい！　梅月せんべいが炸裂したよ！　梅月せんべいで敵をやっつけたよ！」
あ「お前ちょっと黙ってろ」

解説

pop() メソッドは、配列を操作するメソッドの中でも最も基本的なものです。
MDNによると……

pop() メソッドは、配列から最後の要素を取り除き、その要素を返します。このメソッドは配列の長さを変化させます。

つまり、積み重ねられたカードから、一番上に乗っているカードを1枚取って、そのカードを相手に返すようなイメージです。配列というスタック構造のデータの操作としては、最も直感的にわかりやすい動きですね。

push()

イ「おっと、次の敵が出てきたよ！」
あ「どうなってるんだこの街は」
イ「さて、僕が魔法世界から召喚したデータは、今こんな状態になっているよ！」

items = ['羽二重餅', '水ようかん'];

あ「そうだな」
イ「そして、新たに魔法世界から召喚したデータは、これだ！」

newItem = '五月ヶ瀬';

イ「このデータを、元の配列の最後に追加した上で、その最後の要素を敵にぶつけるんだ！」
あ「……それこそ直接ぶつけりゃいいじゃねえか。バカなのかお前は」
イ「いいから！　急いで、あれい！」
あ「面倒くせえなあ……」

return items.push(newItem);

あ「……おい、効いてないぞ」
イ「わははは、引っかかったね！　push()メソッドの戻り値は、配列の要素の数なんだよ！」
あ「お前どっちの味方なんだよ」

解説

push() メソッドも、最も基本的な操作の一つですね。
またまたMDNによると……

push() メソッドは、配列の末尾に 1 つ以上の要素を追加することができます。また戻り値として新しい配列の要素数を返します。

つまり、積み重ねられたカードの上に、さらにカードを乗せるようなイメージです。これも直感的にわかりやすい動きですね。
また、このメソッドの戻り値は、配列の要素の数です。例えば、空の配列に1つの要素をpush()した場合、戻り値は1になります。

イ「さて、ピンチだよ！　どうする、あれい！」

return items[items.push(newItem)-1];

あ「これでいいのか」
イ「あ、うん……攻撃できたね」
あ「だからどっちの味方なんだよ」

return items.slice(0, items.push(newItem)).pop();

あ「これでもいいのか」
イ「あ、slice()とかはもっと後の話で出てくるからまだやめて……」

次回予告

shiftは、配列から最初の要素をなんでも一つ取り除いてあげる。
なんだって構わない。どんな要素だって取り除いてあげられるよ。

第2話 shiftはとってもunshiftって