変数宣言techこの記事でとかletとかvarとか結局どれがどう違くてどれを使えばいいの?ってなる人が少しでも減ればと思います。使用するコードはgitに用意しているので適宜コピーして試してみてください。・JavaScriptの学習を終えてこれからフレームワークを用いた高度なJavaScriptの学習にステップアップを考えている方1.varを用いた変数宣言まず、ES6以前の変数宣言から再確認していきましょう。"再宣言";console.log(value);consoleの値を確認するため下記のHTMLを用意します。src="./index.js"></script></body></html>ディベロッパーツールを使用して確認してみましょうこのようにvarを用いると変数の値の変更や再定義までエラーが起きず実行されてしまうのでプロジェクトの規模が大きくなりコードの量が長くなってくると、意図しない変更が反映されてしまう可能性があるため現在は利用を推奨されていません。次にletを用いた変数宣言を見ていきましょう。"let上書き";console.log(value2);ディベロッパーツールで確認しましょう。letを用いるとvarのように変数の値を上書きすることができます。"再宣言";console.log(value2);ですが、上のように再宣言を行おうとすると、、、このようにエラーが出てしまい、変数の値を出力することができませんでした。このようにvarとは異なり、再宣言はできないのがletです。変数を宣言する際には現在はこちらを使用することが主流になっています。最後にconstを用いた定数宣言を見ていきましょう。"const変数";console.log(value3);constを用いるとvarやletのように変数の定義を行うことができます。ディベロッパーツールで確認しましょう。無事出力できていることがわかります。"const上書き";しかし、値の上書きをしようとすると、、、このようにエラーが出てしまいました。constを使用すると最初の宣言以外でエラーが出てしまうので一番保守性が高いです。値を変更する予定がないものについてはconstを利用するようにしましょう。letでも行えなかった再宣言もすることができません。varの順に保守性が高いことを説明しました。最後にそれぞれができることをまとめていきます。const:最初の変数宣言のみ可能let:最初の変数宣言と値の変更が可能var:最初の変数宣言、値の変更、再宣言すべてが可能まあとりあえずよほどのことがなければvarを使わないようにしましょうねという話です。PdMバッジを贈って著者を応援しようバッジを受け取った著者にはZennから現金やAmazonギフトカードが還元されます。Proよくある質問LinksX(Twitter)GitHubメディアキットLegal利用規約プライバシーポリシ。