ES6

Posted 2020-12-31 yuesu

一、声明变量 （块级作用域）

1.let :

1) 没有预编译，不存在变量提升，

在代码块内，只要let定义变量，在之前使用，都会报错。

2) 同一个作用域，不能重复定义变量

3) for循环：里面是父级作用域

2.const:常量，不可以修改。特性和let相同

1)定义完变量，必须有值，不能后赋值，不能修改

2)对象是引用，地址不变就可以。Object.freeze(对象) 不可以修改对象

// ================let===============

// 1.没有预编译，不存在变量提升
let a=123;
function fn(){
    console.log(a);  //TDZ开始  暂时性死区
    let a=5;//TDZ结束
}
fn();//error: a is not defined

//2. 同一个作用域，不能重复定义变量
let b=12;
let b=1234;
console.log(b);//error:Identifier ‘b‘ has already been declared


//3. for循环：里面是父子级作用域

for(let i=0;i<3;i++){//()里面是父作用域
    let i=‘asd‘;//子作用域
    console.log(i);//asd asd asd
}

let arr=[];
for(let i=0; i<10;i++){
    arr[i]=function(){
        console.log(i);
    }
}
arr[5]();//5 

// 利用闭包解决
let arr=[];
for(var i=0; i<10;i++){
    (function(j){
        arr[j]=function(){
            console.log(j);
        }
    }(i))
}
arr[5]();//5  

// ================const===============

//1. 定义完变量，必须有值，不能后赋值，不能修改
const a;
a=123;
console.log(a);// Missing initializer in const declaration

//2.对象是引用,地址不变就可以,可以修改
const arr1=[‘sas‘,‘wer‘];
arr1.push(‘asd‘);
console.log(arr1); //["sas", "wer", "asd"]

//3.Object.freeze(对象)  不可以修改
const arr=[‘apple‘,‘orange‘];
Object.freeze(arr);
arr.push(‘banana‘);
console.log(arr); //error:Cannot add property 2, object is not extensible

 

二、解构赋值

注意：左右两边，结构格式保持一致

解构：可以起别名，赋给默认值

// 起别名
let obj={
    name:‘weq‘,
    age:12,
}
let {name,age:ag}=obj;//ag 为age 的别名
console.log(name,ag);//weq 12

// 赋值 ，null需要特殊处理
let [a,b,c=‘无‘]=[1,2];//[1,2,undefined]->1 2 "无"  [1,2,null]->1 2 null
console.log(a,b,c); //1 2 "无"

let [a,b,c=‘无‘]=[1,2,null];
if(c==null) c=‘无‘;
console.log(a,b,c); //1 2 "无"

// 先定义在用变量，需要加(),否则会报错{}会被解析为块级作用域
let a;
({a}={a:‘ads‘});
console.log(a);//ads


// 交换两个数的位置
let a=12;
let b=34;
[a,b]=[b,a];
console.log(a,b);//34 12


// 函数传参
 function show({a,b=‘无‘}={}){
     console.log(a,b);
 }
show({a:1});//1 "无"

// 函数返回值
function getPos(){
    return {
        width:10,
        height:20
    }
}
let {width,height}=getPos();
console.log(width,height);//10,20