ES6常用特性之var、let、const的区别

喜欢ヅ旅行 2023-08-17 15:42 150阅读 0赞

说到var、let、const三者的区别，就首先要说的是

### 块级作用域 ###

ES5 中作用域有：全局作用域、函数作用域。没有块作用域的概念。  
ES6 中新增了块级作用域。块作用域由 \{ \} 包括，if语句和 for语句里面的\{ \}也属于块作用域。  
?

//第一种
       {
           var a = 1;
           console.log(a); // 1
       }
       console.log(a); // 1
       // 通过var定义的变量可以跨块作用域访问到。
    
    //第二种
       (function A() {
           var b = 2;
           console.log(b); // 2
       })();
       // console.log(b); // undefined，
       
       // 可见，通过var定义的变量不能跨函数作用域访问到
       
    //第三种
       if(true) {
           var c = 3;
       }
       console.log(c); // 3
       
       for(var i = 0; i < 8; i ++) {
           var d = 10;
       };
       console.log(i); // 8  (循环结束i已经是8，所以此处i为8)
       console.log(d); // 10
       
       // if语句和for语句中用var定义的变量可以在外面访问到，
       // 可见，if语句和for语句属于块作用域，不属于函数作用域。

### var、let、const的区别 ###

*  var定义的变量，没有块的概念，可以跨块访问, 不能跨函数访问。
 *  let定义的变量，只能在块作用域里访问，不能跨块访问，也不能跨函数访问。
 *  const用来定义常量，使用时必须初始化(即必须赋值)，只能在块作用域里访问，而且不能修改。

// 块作用域
        {
            var a = 1;
            let b = 2;
            const c = 3;
            var d;
            let e;
            console.log(a); // 1
            console.log(b); // 2
            console.log(c); // 3
            console.log(d); // undefined
            console.log(e); // undefined
        }
        console.log(a); // 1
        // console.log(b); // undefined
        // console.log(c); // undefined
     
        // 函数作用域
        (function A() {
            var f = 5;
            let g = 6;
            const h = 7;
            console.log(f); // 5
            console.log(g); // 6  
            console.log(h); // 7 
     
        })();
        // console.log(f); // undefined
        // console.log(g); // undefined
        // console.log(h); // undefined

### 3. const定义的对象属性是否可以改变 ###

上面说到 const 是不能修改的，但是实际测试后发现错了，看代码

const student = {
         name : 'John',
         sex : '男'
     }
     
     student.name = 'mike'
     
     console.log(student.name)//  mike

运行上述代码，发现student对象的name属性确实被修改了，这是怎么回事呢？

> 因为对象是引用类型的，student中保存的仅是对象的指针，这就意味着，const仅保证指针不发生改变，修改对象的属性不会改变对象的指针，所以是被允许的。也就是说const定义的引用类型只要指针不发生改变，其他的不论如何改变都是允许的。

const 指针指向的地址不可以变化，指向地址的内容可以变化。  
如果这样写的话

const student = {
         name : 'John',
         sex : '男'
     }
     student = {
         name : 'mike',
         sex : '男'
     }

就会报错  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzE3NjMzNw_size_16_color_FFFFFF_t_70]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzE3NjMzNw_size_16_color_FFFFFF_t_70]: /images/20230810/71762c758a02491390297640d03c656c.png