JavaScriptのvar/let/constについて

2020/09/04 07:44

ES6のJavaScriptで利用できる変数宣言var/let/constについて、それぞれの特徴を動画でわかりやすく解説しています。適用されるスコープの範囲や、不変性が違いについてコードを書いて動作を確認しました。今のところ過渡期であるところもあり現場によって使い分けがされたりする為、なぜ意見が分かれるのかについても触れています。20分弱の動画です。

変数宣言 var/let/const

JavaScriptには変数の宣言方法がいくつかあるのでこれらを確認していきます。

  • var: 古くからある宣言。関数の中のスコープで有効。同じ名前で宣言すると同一視される。
  • let: 新しく作られた宣言。ブロックスコープで有効。変数の指す先が変更可能。
  • const: 新しく作られた宣言。ブロックスコープで有効。変数の指す先が変更不可能。

利用する時に扱いが厳しい順に利用する方がプログラムが堅牢になるので const > let > var の順に検討すると良いです。

言葉

スコープ

変数の有効範囲。JavaScriptの場合は関数の中がスコープの範囲として扱われています。

  • グローバルスコープ: プログラム全体に有効なスコープ
  • 関数スコープ: 関数の中で有効なスコープ function の中
  • ブロックスコープ: ブロックの中で有効なスコープ {} の中。関数の中もブロックの一種と扱われるので、その中でも有効です。

ES6(ES2015とも呼ばれます)

JavaScriptの言語のバージョンを示しています。細かくはECMAScriptという、JavaScriptの言語仕様の6番目の仕様という意味合いになります。

varはES6以前に利用されていたレガシーな仕様なので、ES6以降のletやconstの方が機能がキッチリしています。古くからの互換性を重んじる場合にはvarを利用するでしょうし、新しい仕様で堅牢に書きたい場合にはlet/constを利用すると思います。この辺りはチームや作っているもの、対象ブラウザ等によって違うので、適宜合わせて利用すると良いです。

関連記事

  • AJAX

    2020/09/04 06:00

この記事を書いた人

佐藤 正志

サークルアラウンド株式会社 代表取締役