关于JS解构赋值

按照一定模式，从数组和对象中提取值变量，对变量进行赋值，直接看代码！

数组的解构赋值

1. 基本用法

// ES5 写法
let a = 1
let b = 2
let c = 3
// 或
let a = 1, b = 2, c = 3

// ES6 解构赋值
let [a, b, c] = [1, 2, 3]

// 这种情况下，只要值对应得上，依然可以解构
let [a, b] = [1, 2, 3]
let [a, [b], c] = [1, [2], 4]

// 这种就直接报错啦，左边是个数组，右边都不是数组
let [a] = 1;

2. 默认值

跟函数的默认参数类似，哦？没学过？请点链接

let [a] = [1]
// 1

let [a] = []
// undefined   不设置默认值，默认等于undefined

let [a, b = 2] = [1]
// 1 2

let [a = 1, b = 2] = [2]
// 2 2

let [a, b = 2] = [1, 3]
// 1 3

let [a = 1] = []
// 1

let [a = 1] = [null]
// null   因为 null 不严格等于 undefined，所以默认值不生效

默认值：设置了，就用你设置的；没设置，就用 undefined

对象的解构赋值

前置知识

let [name, age] = ['heycn', 22]
let a = { name, age }
// 等同于
let a = { name: name, age: age }

1. 基本用法

let { name, age } = { name: 'heycn', age: 22 }
name	// "heycn"
age		// 22

2. 默认值

不设置，默认值就是 undefined！

let { x, y = 2 } = { x: 1 }
x // 1
y // 2

函数的解构赋值

function add([a, b] = [1, 2]) {
  return a + b
}
add() // 3

作用

// 我在 vscode 写完格式的话的时候，vscode 会有骚操作，请在浏览器上运行！
let [x, y] = [1, 2]; 一定要加分号！这是在数组前面！
[x, y] = [y, x]
// [2, 1]