变量的解构赋值
1. 数组的解构赋值
默认值可以是其他变量,但该变量必须已经声明
2. 对象的解构赋值
对象的结构赋值,依据是属性名的一致,对象的解构赋值更像是这种方式的简写:
// key 值相当于匹配的模式,value 值才是变量
let {foo: foo, bar: bar} = {foo: 'aaa', bar: 'bbb'}
所以对象的解构赋值的内部机制,是先找到同名属性,然后在赋值给对应的变量,真正赋值的是后者,而不是前者
对象的解构同样也可以使用默认值,默认值产生的条件是对象的属性值是严格等于 undefiend
思考: let {foo: {bar}} = {bar: 'baz'}
时,报错的原因(foo 没有匹配到,为undefined,undefined的bar属性显然是不存在,导致报错)
同样的,将一个已经声明的变量进行解构赋值,必须使用圆括号的形式:
// 对于我们想强行进行赋值的,我们可以给其设置对应的 key 值,然后把他们放在 value 值上,这样就可以利用解构赋值
let x;
({x} = {x: 1})
解构赋值允许等号左边的模式中,不防止任何变量名
3. 字符串的解构赋值
如:
// 这里的字符串被转换成了类数组
let [a, b, c, d, e] = 'hello'
a // "h"
b // "e"
c // "l"
d // "l"
e // "o"
// 所以同样具有 length 属性
let {length : len} = 'hello';
len // 5
4. 数值和布尔值的解构赋值
如果等号右边是数值和布尔值,则会先转为对象
let {toString: s} = 123;
s === Number.prototype.toString // true
let {toString: s} = true;
s === Boolean.prototype.toString // true
本质:解构赋值的规则,只要等号右边的值不是对象或数组,就先将其转为对象,由于 undefined 和 null 无法转为对象,所以对他们进行解构赋值,都会报错
5. 函数参数的解构赋值(需要重新看)
同正常解构赋值一样,参数的解构赋值,在于参数的书写形式:
// 在这里,函数内部感受到的只是 x 和 y
function add([x, y]) {
return x + y
}
同样的函数参数的结构同样可以使用默认值
function move ({x = 0, y = 0} = {}) {
return [x, y]
}
变量的解构赋值的使用场景
- 交换变量的值(一个或者多个)
- 从函数返回多个值(函数只能返回一个值,所以可以把多个值放进数组或者对象里面,使用解构赋值来进行接收)
- 函数参数的定义(解构赋值可以方便的把一组参数与变量名对应起来)
- 提取 JSON 数据(主要是利用对象解构赋值的特点进行提取 JSON 的数据)
- 函数参数的默认值(主要是防止在函数内部或多的进行对参数是否为 undefined 的判断)
- 遍历 map 结构
- 输入模块的指定方法