ES6新增-let与const

复习学习：let与const 的用法（含与var的区别）

　　昨天下午重新看了一章ES6新增，所以今天早上就来写一个笔记，帮助理解，顺便以防后面的复习，在学习let与const之前，应该先要了解到新增的块级作用域，然后再进行let与const的学习，同时对var做一个区分，然后总结，大概的过程就是这样。

 

 

 

1.块级作用域

　　首先，你应该对块级作用域有个大致的了解，然后我们再举几个例子进行应用理解，在ES5的时候，只有全局作用域与函数作用域，想必大家都知道，在函数作用域内定义的变量，出了函数就失效了，但是在ES6的块级作用域里，你可以理解为大括号内（自己的理解）便是一个作用域，因此也叫块级作用域，当然，变量如果能在块级作用域内进行声明赋值，那也就只能在块级内使用，当然如果块级内部还有块级，块级作用域的嵌套，那也是不能使用的，看下面的几个列子分别对ES5与ES6的区别解释。

//ES5中无块级作用域的时候，不合理的情况
​
// 1.变量提升
var tem = 234;
        function f() {
            console.log(tem);
            if (1) {
                var tem = 123;
            }
        }
f(); //undefined,由于变量提升，if内的变量tem的声明，提升到了f()外面，导致的结果
​
// 2.典型的for循坏的i值
for(var i=0;i<5;i++){
    console.log(123);
}
console.log(i);  // 5 ,原因就是声明的i的变量是全局变量，导致i的值的一直在更新变化，最终输出的值一直就是5.而块级就非如此，后面可以看到
​
​
​
//ES6块级作用域
//块级作用域实际上就是一个大括号（对象除外）内，就是一个作用域
​
// 1.块级作用域可以嵌套使用
{{{let a = 2;}}}
​
​
// 2.内块级作用域可以使用外部块级作用域的变量，内部可以重新声明同名的变量，但是外部的作用域不可以使用内部的作用域，
​
//块级作用域的写法
{
    let a= 2;
}
​
//ES5域ES6函数的声明
// 1.在ES5的时候，函数内部作用域不可以再次声明函数，而在ES6中，块级作用域内可以函数声明，但是尽量应该以let的形式声明函数，在块级作用域内声明的函数在块级作用域外面是不可以调用的
​
// 2.前后有很多的变化，因此在ES6的块级作用域内函数的声明尽量使用let声明，类似于let声明变量一样。
​
// 3.虽然规定的很死板，但是考虑到现如今的开发情况，又出现了以下新的规则：允许在块级作用域内声明函数，块级函数的声明将会提升到块级作用域的头部，如果用var声明，将会提升全局用于头部或者函数作用域头部。
​
当然，块级作用域看着和函数类似，但是块级作用域没有返回值，由于考虑到该因素，才有了do的出现

let x = do{
    let t = fu();
    t = t+1;
}
​
//以上代码用到了do，因此块级作用域也有了返回值

 

 

 

2.let的用法(含var的区别比较)

// 1.let 的使用方法于var类似，然是let声明的变量只会在块级作用域内有效(此处在上面应该有所了解，不进行代码举例)
​
// 2.let 声明的变量可以用在for循环
for(let i = 0;i<5;i++){
    console.log(123);
}
console.log(i); //undefined 只能在循环体内部使用，而var外部仍然可以访问到
​
// 3不存在变量提升
//var 的情况
console.log(x); //输出undefined,原因是因为var存在变量提升，在console之前就将变量先声明了
var x = 2;
//let的情况
console.log(x); //报错ReferenceError，let不存在变量提升，只能先声明赋值，后使用，因此会直接报错
let x = 2;
​
//4.暂时性死区
//var与let的声明不同，如果var声明了一个全局变量，但是在一个块级作用域内使用了let 声明，提前调用仍然会报错
var t = 123;
if(1){
    t =  '123';  //会报错ReferenceError，没有
    let t;
}
//使用let与const声明变量之前，ES6就明确形成了其封闭的区域，在使用let声明之前，变量都是不可以用的，这就是叫暂时性死区，并且var与let的声明不同，不可以相互赋值声明，不然就会报错
var x = 5;
let x = x; //报错already been declared
//总之，暂时性死区的本质就是，在当前的作用域内，所要使用的变量已经存在，但是不可以获取，只有等到声明变量的代码出现，才可使用，一句话，先let后使用
​
// 5.不允许重复声明
let a =10;
let a =3; // 报错already been declared，同一个作用域内，不允许重复声明

 

 

 

 

3.const

// 1.const实际上用法与let类似，但是需要在声明的时候就直接赋值，不然就会报错
        {
            const a;
            console.log(a); //报错： Missing initializer in const declaration，const声明未被复制
        }
​
// 2.const同样存在暂时性死区，不能重复声明，也不能变量提升
​
// 3.const的本质实际上是指向的内存地址不能被改变，对于简单数据类型的话，其值都是存储在内存地址中的，因此就只等同于常量，但是在对象中，就可以改变，相当于c语言中的指针
const f = {}
f.a = 123; //成功
f = {}   //失败
//可以改变对象内部的成员，但是不能改变这个对象，同样数组也是一个对象，因此操作也不行

 

 

 

4.let与const涉及到顶级对象的问题

//var的声明是全局的，因此如果用window.变量名也可以使用，用另一句话说就是，var中全局变量就相当于window的属性，基本一样，但是let，const，新增class命令不属于顶层对象的属性，也就是说，从ES6开始，全局变量将逐步与顶层对象的属性隔离。
 

 

 

5.总结变量声明的方法

//let，var，const，calss，还有import，export方法，后面会继续复习到

 

 

 

 

以上就是我第一章复习的全部内容，里面有从书上看的内容，有我自己总结的内容，有我自己写的demo，以便于日后复习，同时如果有一同学习的人，可以相互借鉴。