var-let-const.md

var vs let vs const

全部変数を宣言するキーワードという共通点がるが、letとconstは ES2015(ES6)から登場し、色んな特徴を持つ。

スコープ

• varは関数スコープ。
• letと constはブロックスコープ。

function run() {
    var foo = 'Foo'
    let bar = 'Bar'

    console.log(foo, bar)

    {
        let baz = 'Bazz'
        console.log(baz)
    }

    console.log(baz) // ReferenceError
}

run()

Hoisting

• varは 関数スコープの最上段に Hoisting され、宣言の時 undefined となる。
• letと const はブロックスコープの最上段に Hoisting され 宣言だけされ、値が与えられる前にはなんの値を持たない。

function run() {
    console.log(foo) // undefined
    var foo = 'Foo'
    console.log(foo) // Foo
}

run()

function checkHoisting() {
    console.log(foo) // ReferenceError
    let foo = 'Foo'
    console.log(foo) // Foo
}

checkHoisting()

letの場合宣言前に Hoisting されるが、どんな値ももたないため ReferenceError が発生する。これを**TDZ(Temporal Dead Zone)**という。

Global object

strict mode 以外

varは global scope で宣言された時 global object に Binding されるが、let, constは Binding されない。

var foo = 'Foo' // globally scoped
let bar = 'Bar' // globally scoped

console.log(window.foo) // Foo
console.log(window.bar) // undefined

再宣言 (Redeclaration)

• varは 再宣言が可。
• letと constは不可

var foo = 'foo1'
var foo = 'foo2' // 問題ない。

let bar = 'bar1'
let bar = 'bar2' // SyntaxError: Identifier 'bar' has already been declared

let vs const

• var と let は変更可
• const は宣言と同時に初期化が行われるため、変更が不可。

Reference

• Stackoverflow, What's the difference between using “let” and “var”?
• Stackoverflow, Are variables declared with let or const not hoisted in ES6?
• PoiemaWeb, let, const