【ES6学习】字符串、布尔、数值及函数参数的解构赋值和圆括号问题

1.字符串的解构赋值

字符串也可以解构赋值。这是因为此时字符串被转换成了一个类似数组的对象。

const [a , b, c , d , e] = ' hello '; 
a // ” h ” 
b // ” e ” 
c // ” l ” 
d // ” l ” 
e //'0'

类似数组的对象都有一个 length 属性, 因此还可以对这个属性进行解构赋值

let {length : len} =' hello '; 
len //5

2.数值和布尔值的解构赋值

解构赋值时， 如果等号右边是数值和布尔值 ，则会先转为对象。

let {toString : s} = 123 ; 
s === Number.prototype.toString // true 
let {toString: s} = true; 
s === Boolean.prototype.toString  //true 

上面的代码中，数值和布尔值的包装对象都有 toString 属性 因此变量s都能取到值

解构赋值的规则是，只要等号右边的值不是对象或数组，就先将其转为对象。由于undefined和 null 无法转为对象，所以对它们进行解构赋值时都会报错。

let { prop: x } =undefined; // TypeError 
let { prop: y } = null; //TypeError

3.函数参数的解构赋值

函数的参数也可以使用解构赋值。

function add ( [x, y]) { 
	return x + y; 
}
add ( [ 1, 2 ]) ; // 3 

上面的代码中，函数 add 的参数表面上是一个数组，但在传入参数的那一刻，数组参数就被解构成变量x和y
。对于函数内部的代码来说，它们能感受到的参数就是x和y。

下面是另一个例子。

[[1, 2], [3, 4]].map(([a, b]) =>a+ b); 
// [ 3, 7 ] 

函数参数的解构也可以使用默认值。

function move ({ x = 0, y = 0} = {}) { 
	return [x, y]; 
}
move ( { x : 3, y : 8 } ) ; // [ 3, 8 ]
move ( { x : 3 } } ;  //[3, O]
move ({}); //[O, O]
move(); //[O, O]

上面的代码中，函数 move 的参数是一个对象，通过对这个对象进行解构，得到变量x和y的值。如果解构失败，x和y 等于默认值。
注意，下面的写法会得到不一样的结果。

function move ({ x , y } = {x:0,y:0}) { 
	return [x, y]; 
}
move ( { x : 3, y : 8 } ) ; // [ 3, 8 ]
move ( { x : 3 } } ;  //[3, undefined)]
move ({}); //[undefined), undefined)]
move(); //[O, O]

上面的代码是为函数 move 的参数指定默认值，而不是为变量x和y 指定默认值，所以会得到与前 种写法不同的结果。
undefined 就会触发函数参数的默认值。

[1 , undefined, 3].map( (x =' yes ') => x); 
// [ 1,’yes ’, 3 ]

4圆括号问题

解构赋值虽然很方便，但是解析起来并不容易。对于编译器来说，一个式子到底是模式还是表达式，没有办法从一开始就知道，必须解析到（或解析不到）等号才能知道。
由此带来的问题是，如果模式中出现圆括号该怎么 ES6 的规则是，只要有可能导致解构的歧义，就不得使用圆括号。
但是，这条规则实际上不那么容易辨别， 理起来相当麻烦。因 建议，只要有可能，就不要在模式中放置圆括号。

4.1不能使用圆括号的情况

以下 三种解构赋值不得使用圆括号。
1. 变量声明语句

／／全部报错
let [(a))= [1]; 
let {x: (c)} = {} ; 
let ({x: c}) = {}; 
let {(x: c)} = {); 
let {(x): c} = {}; 
let { o: ( { p: p } ) } = { o: { p: 2 } } ;

上面6 个语句都会报错，因为它们都是变量声明语句，模式不能使用圆括号。

2. 函数参数
函数参数也属于变量声明，因此不能使用圆括号。

//报错
function f ( [ (z) ]) { return z ; } 
//报错
function f([z , (x)]) {return x ; }

3.赋值语旬的模式

//全部报错
({ p: a }) = { p: 42 }; 
([a]) = [5]; 

上面的代码将整个模式放在圆括号之中，导致报错。

//报错
[({ p: a}) , { x : c }] = [{} , {}] ; 

上面的代码将一部分模式放在圆括号之中, 导致报错。

4.2 可以使用圆括号的情况

可以使用圆括号的情况只 一种：赋值语句的非模式部分可以使用圆括号。

[ (b) ]＝ [3] ; //正确
({ p: (d) }={}) ; //正确
[(parseint.prop)] = [3] ; //正确

上面 3行语句都可以正确执行 ,因为它们都是赋值语旬，而不是声明语句，另外它们的圆括号都不属于模式的一部分。第1 行语句中, 模式是取数组的第 1个成员 ,跟圆括号无关；第2行语句中，模式是p 而不是d ；第3 行语句与第 1行语句的性质一致。