ES6核心知之 let const 解构赋值

野性酷女 2023-07-05 11:47 2阅读 0赞

## ES6核心知识 ##

### 1 变量定义变化let&const ###

##### let #####

1、不允许重复定义变量

2、不存在变量提升，只能先定义后调用，会报错，var不会报错

3、块级作用域 ，即变量作用域\{\} 、for循环等等

##### const #####

用于定义常量，定义时必须初始化，常量不能重新赋值

<table> 
 <thead> 
  <tr> 
   <th align="left">var</th> 
   <th>let</th> 
   <th>const</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td align="left">函数级作用域<br>变量提升<br>值可以改变</td> 
   <td>块级作用域<br>不存在变量提升<br>值可以改变</td> 
   <td>块级作用域<br>不存在变量提升<br>值不能改</td> 
  </tr> 
 </tbody> 
</table>

#### var&let比较 ####

//var 定义变量
    		for(var i=0; i<3; i++) { 
                setTimeout(function() { 
                    console.log(i);
                });
            }
    //for()是同步任务，setTimeout异步任务，同步任务全部执行完，才执行异步
    //最后结果：3 3 3
    
    		for(let i=0; i<3; i++) { 
                setTimeout(function() { 
                    console.log(i);
                });
            }
    //最后结果：0 1 2

### 2 解构赋值 ###

数组赋值

let arr = [1,[2],3];
            let [a,b,c] = arr;
            console.log(a,b,c);

对象赋值

var { name:name1,age:age1} = { name: 'along', age:'32'}
            console.log(name1);  //冒号重命名
            console.log(age1);

数组对象赋值

let [,{ hobby:hb}] = [{ 
                name: 'along',
                age: 32
            },
            { 
                hobby: ['coding','running']
            }
            ];
            console.log(hb);

省略结构

let [, , c] = [10, 20, 30];
    console.log(c);

默认结构

let { a:a1,c1 = 30}  = { a:10,b:20,c1:40}
            console.log(a1,c1);  //c1有值40，如果没有就是30
    	
    //函数
     function fn({ a,b}) { 
                console.log(a,b);
            }
            fn({ a:10,b:20});