JavaScript let
letキーワードはES6(2015)で導入されました。
letで定義された変数は再宣言できません。
letで定義された変数は使用前に宣言する必要があります。
letで定義された変数にはブロックスコープが適用されます。
再宣言は不可
letで定義された変数は再宣言できません。
letで宣言された変数を誤って再宣言することはできません。
letでは次のようなことはできません。
let x = "テックアイエス";
let x = 0;
varを使用すると、次のことが可能です。
var x = "テックアイエス";
var x = 0;
ブロックスコープ
ES6(2015)より前は、JavaScriptにはグローバルスコープと関数スコープがありました。
ES6では、letとconstという2つの重要な新しいJavaScriptキーワードが導入されました。
これら2つのキーワードは、JavaScriptでブロックスコープを提供します。
{ }ブロック内で宣言された変数は、ブロックの外からアクセスできません。
例
{
let x = 2;
}
// ここではxは使えません。
varキーワードで宣言された変数はブロックスコープを持つことはできません。
{ }ブロック内で宣言された変数は、ブロックの外からアクセスできます。
例
{
var x = 2;
}
// ここでxを使えます。
変数の再宣言
varキーワードを使用して変数を再宣言すると、問題が発生する可能性があります。
ブロック内の変数を再宣言すると、ブロックの外側の変数も再宣言されます。
letキーワードを使用して変数を再宣言すると、この問題を解決できます。
ブロック内で変数を再宣言しても、ブロック外で変数は再宣言されません。
ブラウザのサポート
letキーワードは、Internet Explorer11以前では完全にはサポートされていません。
次の表は、letキーワードを完全にサポートする最初のブラウザのバージョンを明示しています。
| Chrome 49 | Edge 12 | Firefox 44 | Safari 11 | Opera 36 |
| 2016年3月 | 2015年7月 | 2015年1月 | 2017年9月 | 2016年3月 |
再宣言
varを使用したJavaScript変数の再宣言は、プログラム内のどこでも許可されます。
letでは、同じブロック内で変数を再宣言することはできません。
例
var x = 2; // 許されます
let x = 3; // 許されません
{
let x = 2; // 許されます
let x = 3; // 許されません
}
{
let x = 2; // 許されます
var x = 3; // 許されません
}
別のブロックでletを使用して変数を再宣言することは許可されます。
letの巻き上げ
varで定義された変数は最上位に巻き上げられ、いつでも初期化できます。
意味: 宣言する前に変数を使用できます。
巻き上げについてさらに詳しく知りたい場合は、JavaScript巻き上げの章を参照してください。
letで定義された変数もブロックの先頭に巻き上げられますが、初期化されません。
意味:let変数を宣言する前に使用すると、ReferenceErrorが発生します。
プログラミング学習を加速させる
プログラミングをプロの講師に教えてもらいませんか。