【ES6 笔记】var、let、const

2018-10-24 本文已影响0人 ___Jing___

最近在整理笔记，先从ES6相关开始，自己写笔记的时候只是将书中重点部分简单记了一下，现在尽量整理成方便理解和阅读的方式。

关键字	变量提升(Hoisting)	块级声明	重复声明	修改赋值	临时死区	循环中块作用域绑定	全局块作用域绑定
var	Yes	No	Yes	Yes	No	No	No
let	No	Yes	No	Yes	Yes	Yes	Yes
const	No	Yes	No	No	Yes	Yes	Yes

关于变量提升：
在函数作用域或是全局作用域中通过var关键字声明的变量，无论实际在哪里声明，都会被当成在当前作用域顶部声明的变量，这就是提升机制。

        function getValue(condition){
            //实际相当于在这里定义了 var value; =>变量提升
            if(condition){
                console.log(value) //undefined
                var value = 'blue';  //这里相当于赋值  value=“blue”
                console.log(value) //blue
                return value
            }else{
                console.log(value) //undefined
                return null;
            }
            console.log(value) //undefined
        }

关于块级声明：

        function getValue(condition){
            //let或是const关键字定义的变量不会提升，只存在声明的块中，这里访问报错
            if(condition){
                console.log(value)  //变量不会提升，这里访问报错
                let value = 'blue';  
                console.log(value) //blue
                return value
            }else{
                console.log(value)  //变量不会提升，这里变量不存在，这里访问报错
                return null;
            }
            console.log(value) //变量不会提升，这里变量不存在，这里访问报错
        }

关于重复声明：
1. var关键字声明的变量，重复声明的时候，后声明的会覆盖先声明的；
2. let和const关键字声明的变量，如果在作用域中已经存在了，重复声明的时候就会报错

关于修改赋值：
const关键字声明的是常量，一旦定义，就不能再修改了，也因此在初始化的时候就需要进行赋值，否则会抛错，其他两个关键字可以先声明后赋值，也可以赋值以后再进行修改。
关于临时死区：

        console.log(typeof value) //undefined 在声明变量value作用域之外
        if(true){
            console.log(type of value)  //抛错，value变量声明所在的作用域内，变量还没声明，尚在所谓的临时死区中
            //value变量在所在作用域内的临时死区内，在该区域，value变量声明之后，才会从TDZ（temporal dead zone 临时死区）中移出来
            let value = 'blue'
        }

关于循环中块作用域绑定：

      for(var i=0;i<10;i++){ 
          //do something 
      }  
      console.log(i) //10
      //由于var声明的变量进行了变量提升，所以循环结束后i仍可以访问

     for(let i=0;i<10;i++){ 
          //do something
     }  
    console.log(i) //报错
    //let声明的变量只在循环中存在，循环结束后，其他地方无法访问该变量

关于全局块作用域绑定：
在全局作用域下进行以下声明

        var hello = 'hello';
        let  world = 'world';
        console.log(window.hello)//hello
        console.log(window.world)//undefined

       // var变量在全局作用下声明的变量，会覆盖window上的同名属性，而let声明的变量不会修改window上的属性；

【ES6 笔记】var、let、const

猜你喜欢

热点阅读