【ES6】变量 let 以及 const

var的缺点

1、可以重复声明

    var a = 12
    var a = 5
    alert(a) //5

2、无法限制修改（没有常量）

    var a = 12
    a = 5
    alert(a) //5

3、没有块级作用域

    if(true){
        var a = 5
    }
    alert(a) //5

不可重复声明 let、const

Identifier 'a' has already been declared

    let a = 5
    let a = 12
    alert(a) //Identifier 'a' has already been declared

值不可修改 const

Assignment to constant variable

    const a = 12
    a = 5
    alert(a) //Assignment to constant variable

    let a = 12
    a = 5
    alert(a) // 5

块级作用域 let、const

a is not defined

    if(true){
      let a = 5
    }
    alert(a) //a is not defined

实例、块级作用域的优势

经典点击案例

<body>
    <input type="button" value="按钮">
    <input type="button" value="按钮">
    <input type="button" value="按钮">
    <script>
        window.onload = function () {
            var aBtn = document.getElementsByTagName('input')
            for (var i = 0; i < aBtn.length; i++) {
                (function (i) {
                    aBtn[i].onclick = function () {
                        alert(i) //0 1 2
                    }
                })(i);
            }
        }
    </script>
</body>

优化后

    window.onload = function () {
        var aBtn = document.getElementsByTagName('input')
        for (let i = 0; i < aBtn.length; i++) {
            aBtn[i].onclick = function () {
                alert(i)
            }
        }
    }

【ES6】变量 let 以及 const

var的缺点

不可重复声明 let、const

值不可修改 const

块级作用域 let、const

猜你喜欢