初入ES6-解构

发布时间:2019-08-09 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了初入ES6-解构脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

ES6允许按照一定的模式,从数组或者对象中取值,对变量进行赋值

数组

VAR a = 2;
var b = [1,2];
var c = 'thisi';
//ES6 解构的对象要具有ITerator接口也就是可以遍历
var [a,b,c] = [1,2,3]        //按照对应的关系进行取值
var [a,...b] = [1,2,3,4];
a = 1;
b = [2,3,4];
//如果解构不成功变量的值就是undefind;
var [a ] = [];
a = undefind;
//如果右侧的数值不是数组,就会报错
var [a] = 1;    //Uncaught TyPEError: false is not iterable,注意字符串是可以遍历的
            =Nan;
            =fasle;
            =null;
            ={}
`
//也可以有默认值
var  [a,b = 3] = [5];//只要被赋值的变量不是严格===undefined;就是默认值,不包括 null 
a = 5;
b = 3;
//惰性求值
function fn(){return 1};
var[a =fn() ] = [2];
a //2
//变量的值可以是其他的变量,但是要已经声明过的
var [x = 1,y =x] = [];
x//1
y//1
let [x= y,y] = []    //Uncaught ReferenceError: y is not defined

对象

//使用var const let解构赋值,右侧必须有值进进行初始化,如果不是解构赋值,就正常使用
var obj = {
    a:1,
    b:3
}
var a = obj.a;
var b = obj.b;
var {a,b} = obj;        //更加的直接
a//1
b//3
var {a,b} = {a:1,b:2};       //属性的名称要一样,位置可以不一样没有的话就undefined
a//1
b//2
//也可以给已经存在的变量赋值
var a = 1;
var b = 2;
var obj = {
    a:11,
    b:22
}
({a,b} = obj)    //外侧有小括号,ES6大括号是代码块,不允许出现在赋值的左侧
//也可以有默认值,只有解构的值===undefined的时候有效
var {a,b,c=23} = {a:2,b:2}        //c =23

//不同名的属性变量
var obj = {
    a : 1,
    b:2
};
var {a:x,b:y} = obj
a//Uncaught ReferenceError: a is not defined
x//1
//嵌套的对象
var obj = {
    a:1,
    b:{
    x:{num:1}
    }
}
var {b:{x}} = obj;
x= {num:1}

脚本宝典总结

以上是脚本宝典为你收集整理的初入ES6-解构全部内容,希望文章能够帮你解决初入ES6-解构所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。