es6中解构赋值-讲解使用

应用：数据交互 ajax返回的数据

let [a,b,c]=[12,5,6];
console.log(a,b,c);
let json={
    name:'bill',
    age:'18',
    job:'程序猿'
};
let{name,age,job}=json;
console.log(name,age,job);
let{name,age,job:jj}=json;//这个语法转定义成自己得名字，用得不多。
console.log(name,age,jj);//输出bill,18,程序猿

注意左右两边的数据结构格式要一样
解构的时候可以给默认值

let arr=[12,5];
let [a,b,c='暂无数据']=arr;//如果某个数据返回的是undefined
let arr2=[12,5,null]
let [d,e,f='暂无数据']=arr2;//如果某个数据返回得是null
console.log(a,b,c);//12,5,'暂无数据'
console.log(d,e,f);//12,5,null

先定义后赋值的写法容易出错，一般不会这么用，若出现解决方式是在{}外包个（{}），否则容易被解析成块级作用域。

let g;
({g}={g:'apple',h:'orange'});
console.log(g);//apple

交换数组的位置

let j=13,k=5;
[j,k]=[k,j];
console.log(j,k);//5,13

封装函数的应用

function getPos() {
    return{
        lang:10,
        lat:20
    }
}
let {lang,lat}=getPos();
console.log(lang,lat);

函数传参的应用

function show({a,b}) {
    console.log(a,b)
}
show({
    a:1,b:2
})//1，2