【初心者向け】var/let/constの違いを解説

こんにちはtakosanです。
フロントエンド関心強めのWordPressエンジニアとして働いています。

JavaScriptで変数を定義する際、varletconstの3つのキーワードが使えますが、それぞれに特徴があります。正しい状況で適切なキーワードを選択することは、コードの可読性と保守性を高める上で非常に重要ですので、この記事でマスターしましょう。

教えてくだされ

目次

varは非推奨

いきなりですがvarの使用は非推奨となっています。

varはJavaScriptの初期から存在する変数宣言のキーワードですが、varには幾つかの問題点があります。

最も大きな問題は、変数のスコープが関数レベルであるため、予期せぬ場所で変数が再宣言されたり、値が変更されることがあります。加えて、変数の巻き上げ(hoisting)により、コードの読みづらさを招くこともあります。

このような理由から、現代のJavaScript開発ではvarの使用は推奨されていません。

具体的にはES6(ECMAScript 2015)が登場した2015年から非推奨となりました。

「ここにはvarを使うべきだろうか?」と考えることは通常有り得ないので、

とにかくvarは基本使わないと覚えておきましょう。

letとconstの違い

さて、では現在の環境で使用されるletconstにはどのような特徴があるのでしょうか。

両者の最大の違いは、

letで宣言された変数は再代入が可能なのに対し、

constで宣言された変数は再代入が不可能であることです。

また、letconstはブロックスコープを持ち、より厳密なスコープ管理が可能です。

ブロックスコープとは
変数が定義されたブロック(たとえば、if文やforループなどの中括弧 {} で囲まれた部分)内でのみアクセス可能で、ブロックの外部からはアクセスできないというスコープのこと。

letが適切なパターン

letは変数の値が変更される可能性がある場合に適しています。

以下の例では、ループの中でカウンタ変数を使用しています。この変数はループの各処理で値が変わるため、letを使用するのが適切です。

for (let i = 0; i < 5; i++) {
    console.log(i);
}
// 出力: 0, 1, 2, 3, 4

この例では、iはループの各ステップで値が変わります。

letを使用することで、変数のスコープがループのブロック内に限定され、外部からのアクセスを防ぎます。

変数内の値がコロコロ変わる可能性があるときは、letを使うと覚えておいて問題ないでしょう。

constが適切なパターン

constは再代入が不要な変数、特に不変の値を扱う際に使用します。以下の例では、定数を宣言しています。

const PI = 3.14;
console.log(PI);
// 出力: 3.14

この例では、PIは円周率を表す定数であり、プログラムの実行中にその値が変更されることはありません。したがって、constを使用して、その値が不変であることを示しています。

一度定義した変数の値が変わることがない場合には、constを使用すると覚えておくといいでしょう。

どれを使用するか迷ったら

変数を宣言する際にどのキーワードを使用すべきか迷った場合、まずはconstを使用することを検討してください。

再代入が必要でなければ、constが最適です。もし後で変数の値が変更されることが分かっている場合は、letを使用しましょう。varは古いコードでのみ使用し、新しいコードでは避けるべきです。

参考になれば幸いです。

あまりvarは使うなよ、弱く見えるぞ

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次