解构

数组解构

数组解构需要使用[]包含用于接收数据的变量
let arr = [123, 2, 4, 325, 346]
// 原先写法：
// let a = arr[0]
// let b = arr[1]
// let c = arr[2]
// let [解构时定义的用于接收数据的变量名称] = 源数据结构
let [a, b, c] = arr
console.log(a, b, c)

对象结构

let obj = {
  say() {
    console.log('say')
  },
  hi() {
    console.log('hi')
  },
  hello() {
    console.log('hello')
  }
}
// 原先写法：
// let hi = obj.hi
// let hello = obj.hello
// let{解构时定义的用于接收数据的变量名称} = 源数据结构
let {hi,hello} = boj
​
hi()
hello()

注：如果结构时定义的名称不对应，则返回undefined

解构-细节

情况一：解构属性

let name = 'rose'
​
let obj = {
    name:'jack',
    age:20,
    computer: {
        brand:'dell',
        price:6000
    }
}
// 这时我想解构对象里的name，可是外面也有一个name的命名，解构会不成功，报错，因为重复变量
// 通过 ：来对对象里的name进行重命名即可
let { name:aa } = obj
console.log(aa)

情况二：解构方法里的属性

let name = 'rose'
​
let obj = {
    name:'jack',
    age:20,
    computer: {
        brand:'dell',
        price:6000
    }
}
// 这时我想对price进行解构 方法：{属性} = 当前数组
// 通过 ：{} 可以实现深层解构
let {
    computer: {price} 
} = obj
console.log(price)

小案例

// 请过解构，来交换他们之间的数据
let a = 10
let b = 20;
[b,a] = [a,b]
console.log(a,b)