定义

按照一定模式，从数组和对象中提取值，对变量进行赋值

解构赋值其实就是一种『模式匹配』， 只要等号两边的模式是完全相同的，那么左边的变量就会能被赋值成对面右边的值 如：

[A,B,C] = [A,B,C]
{a: 1,b: 2,c: 3} = {a: 1,b: 2,c: 3}

数组解构

数组解构 是按照数组的下标去对应的

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

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

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

// c对应的是3
let [a,b,[c]] = [1,2,[3,4]]
console.log(a,b,c);    // 1,2,3 

// 这种匹配模式是惰性的，如果传了就以传的为优先，如果不传就取默认值
let [a,b,c,d] = [1,2,[3,4]]
console.log(a,b,c,d);   // 1,2,[3,4],undefined

对象解构

对象解构的时候是按照key的名称去对应的，而不是通过顺序去对应

let user = {
    名字: 'lee',
    年龄:18,
    名族: "汉"
}

let {名字,年龄} = user
console.log(名字,年龄);       // lee 18

// 如果声明的时候调换变量的顺序
let user = {
    名字: 'lee',
    年龄:18,
    名族: "汉"
}

let {年龄,名字,} = user
console.log(名字,年龄);       // lee 18  对象中的key是唯一的

// 给变量起一个别名
let user = {
    名字: 'lee',
    年龄:18,
    名族: "汉"
}
let {名字: 乳名,年龄:芳龄} = user
console.log(乳名,芳龄);       // lee 18 

字符串解构

把它当做数组的解构来解构

let str = "EcmaScropt"
let [a,b,c,d,e,f,g] = str
console.log(a,b,c,d,e,f,g);               // E c m a S c r

应用场景

给变量赋默认值

JS中给变量赋默认值是一种『惰性赋值』

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

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

let {name,age=18} = {name: 'lee',age: 28}
console.log(name,age);                   // lee 28

let {name,age=18} = {name: 'lee'}
console.log(name,age);                   // lee 18

function foo(){
    console.log(123);
}

let [a = foo()] = [1]                    // 不输出123  

function foo(){
    console.log(123);
}

let [a = foo()] = []                     // 输出123  

函数参数的解构赋值

function foo([a,b,c]){
    console.log(a,b,c);
}

foo([1,2,3])                              // 1,2,3

function foo({name,age}){
    console.log(name,age);
}

foo({name:'lee',age:18})                   // lee 18

function foo({name,age,school="BeiDa"}){
    console.log(name,age,school);
}

foo({name:'lee',age:18})                  // lee 18 BeiDa


function foo({name,age,school="BeiDa"}){
    console.log(name,age,school);
}

foo({name:'lee',age:18,school:"QingHua"})   // lee 18 QingHua

对返回值进行解构

function foo(){
    let obj = {
        name:'lee',
        age:18,
        school:"QingHua"
    }
    return obj
}
let {name,age,school} = foo()
console.log(name,age,school)

提取JSON数据

使用JSON.parse()将JSON字符串转成对象，然后使用对象的解构赋值

let json = '{"a": "Ecma","b":"Script"}'
let {a,b} = JSON.parse(json)
console.log(a,b)                          // Ecma Script