JavaScriptの再代入とは？付箋を貼り替えるイメージで楽しく解説【ITTI】

付箋を書き直すイメージで理解しよう

ringoっていう名前の付箋で、内容がapple。

再代入すると、ringoっていう名前の付箋の内容がappleを消しゴムで消して、新しい内容がorangeにする。

これが再代入っていうイメージ。

JavaScriptを学んでいると「再代入」という言葉が出てきます。

「代入は分かったけど、再代入って何？」と感じる人も多いはずです。

この記事では、再代入を「付箋の貼り替え」にたとえて、コード例と寸劇で楽しく理解できるようにまとめました。

再代入とは？

再代入とは、すでに作った変数に新しい値を書き直すことです。

要するに、付箋の内容を消して書き直すこと。

コードはこちら

let ringo = "apple";　→ 最初の代入

ringo = "orange";　→ 再代入

console.log(ringo);　→　ringoの内容は何？

let ringo = "apple";　→ 最初の代入

ringo = "orange";　→ 再代入

console.log(ringo);　→　ringoの内容は何？

寸劇でイメージ

let ringo = “apple“; // 代入

ユーザー「ringo って付箋を作って、内容は apple にしたろ！」

JavaScript「了解！ringo は今 apple なう！」

ringo = "orange"; // 再代入

ringo = "orange"; // 再代入

ユーザー「あーごめん！訳があって、orange にするわ！書き直そう！」

JavaScript「マジかよ！ appleを消しゴムで消して、ringoの内容は、orangeにした！ でも、他のコードがないから実行結果はorangeや！」

実行結果

orange

実行結果

orange

まとめ

•  再代入とは「変数を書き直すこと」

•  イメージは「付箋の内容を書き直す」

JavaScriptが『appleを消してorangeにした！』って言ってたよね。つまりそれが再代入！

最後まで読んで頂きありがとうございました！