视频学习笔记01

视频学习笔记

ES6中的let和const

ES5中的var在if和for中都没有块级作用域的概念，所以很多时候需要借用function的作用域来解决外面变量的问题。
但是在ES6中，加入了let，它有if和for的块级作用域

变量作用域

变量在什么范围内是可用的

{
  var name = 'Jane';
  console.log(name);
}
console.log(name);

在控制台会输出两次name的值，因为在ES5中的var是没有变量作用域的的概念
没有作用域有时候会引起一些问题，例如有几个按钮，现在要实现点击某个按钮就在控制台输出

var btns = document.getElementsByTagName('button');
    for (var i=0; i<btns.length; i++) {
        btns[i].addEventListener('click',function () {
            console.log('第' + i + '个按钮被点击');
        })
    }

按如上代码不管点击哪个按钮，控制台只会输出最后一个按钮的值，因为没有for的块级作用域
在ES5中一般采用闭包来解决问题：因为函数是一个作用域

    var btns = document.getElementsByTagName('button');
    for (var i=0; i<btns.length; i++) {
        (function (i) {
            btns[i].addEventListener('click',function () {
            console.log('第' + i + '个按钮被点击');
        })(i)
        })
    }

这样每一个按钮都有自己的一个监听函数，不会再出现上面的问题
ES6中解决问题更为方便，可以直接将var换成用let来声明，let在for中有自己的作用域，每次执行代码时for内的i值都是不一样的，所以不会出现ES5中的问题

ES6中的const

使用const修饰的标识符为常量，不可以再次被赋值
当修饰的标识符不会被改变时，就可以采用const来保证数据的安全性
一般只有需要改变一个标识符的时候才使用let