时间：2021-07-01 10:21:17 帮助过：13人阅读
简单的理解就是赋值=号左右两侧具有相同的结构，来进行一一对应的赋值的语句
二、解构赋值的分类
数组解构赋值 对象解构赋值 字符串解构赋值 布尔值解构赋值 函数参数解构赋值 数值解构赋值 （重点理解前两个就可以了）
三、对于每个分类单独解释
1、数组解构赋值（下面进行代码展示，并添加必要的注释便于理解）
{
let a,b,rest;
[a,b]=[1,2];
console.log(a,b);//输出1,2 直接将1和2解构到a和b}也可以对变量设置默认值例如下面代码的c 就是默认为3 如果解构例如[a,b,c]=[1,2] 没有对c进行解构 则c为undefined
{
let a,b,c,rest;
[a,b,c=3]=[1,2];
console.log(a,b);}使用场景1
①、变量交换
{
let a=1;
let b=2;
[a,b]=[b,a];
console.log(a,b);
}②、对函数返回值直接提取（没有解构赋值 需要先取出结果 然后通过索引来进行取出）
{ function f(){return [1,2]
}
let a,b;
[a,b]=f();
console.log(a,b);
}③、只取出返回结果的某些需要的值
{ function f(){return [1,2,3,4,5]
}
let a,b,c;
[a,,,b]=f();
console.log(a,b); // 输出1 4
}④、不关心数组的内容长度
{ function f(){return [1,2,3,4,5]
}
let a,b,c;
[a,...b]=f();
console.log(a,b);//输出1,[2,3,4,5]
}2、对象解构赋值
{
let o={p:42,q:true};
let {p,q}=o;
console.log(p,q);
}对象解构赋值设置默认值
{
let {a=10,b=5}={a:3};
console.log(a,b);//输出3 5
}稍微复杂的对象的解构赋值
{
let metaData={
title:'abc',
test:[{
title:'test',
desc:'description'}]
}
let {title:esTitle,test:[{title:cnTitle}]}=metaData;
console.log(esTitle,cnTitle);//abc test （相当于esTitle和cnTitle分别对应metaData里面的abc和test）
}以上就是ES6学习之解构赋值实例详解的详细内容，更多请关注Gxl网其它相关文章！