Skip to content

Commit 93d3b85

Browse files
committed
edit destructring
1 parent 958f789 commit 93d3b85

File tree

2 files changed

+97
-29
lines changed

2 files changed

+97
-29
lines changed

docs/destructuring.md

Lines changed: 83 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,6 @@ tail // [2, 3, 4]
4545
```javascript
4646
var [foo] = [];
4747
var [foo] = 1;
48-
var [foo] = 'Hello';
4948
var [foo] = false;
5049
var [foo] = NaN;
5150
var [bar, foo] = [1];
@@ -133,36 +132,14 @@ sixth // 5
133132

134133
上面代码中,fibs是一个Generator函数,原生具有Iterator接口。解构赋值会依次从这个接口获取值。
135134

136-
## 字符串的解构赋值
137-
138-
由于JavaScript引擎内部,某些场合时,字符串会被转为类似数组的对象。因此,字符串也可以解构赋值。
139-
140-
```javascript
141-
const [a, b, c, d, e] = 'hello';
142-
a // "h"
143-
b // "e"
144-
c // "l"
145-
d // "l"
146-
e // "o"
147-
```
148-
149-
类似数组的对象都有一个length属性,因此还可以对这个属性结构赋值。
150-
151-
```javascript
152-
let {length : len} = 'hello';
153-
len // 5
154-
```
155-
156135
## 对象的解构赋值
157136

158137
解构不仅可以用于数组,还可以用于对象。
159138

160139
```javascript
161-
162140
var { foo, bar } = { foo: "aaa", bar: "bbb" };
163141
foo // "aaa"
164142
bar // "bbb"
165-
166143
```
167144

168145
对象的解构与数组有一个重要的不同。数组的元素是按次序排列的,变量的取值由它的位置决定;而对象的属性没有次序,变量必须与属性同名,才能取到正确的值。
@@ -244,12 +221,11 @@ var x;
244221

245222
```javascript
246223
// 正确的写法
247-
248-
({x}) = {x:1};
249-
// 或者
250224
({x} = {x:1});
251225
```
252226

227+
上面代码将整个解构赋值语句,放在一个圆括号里面,就可以正确执行。关于圆括号与解构赋值的关系,参见下文。
228+
253229
对象的解构赋值,可以很方便地将现有对象的方法,赋值到某个变量。
254230

255231
```javascript
@@ -258,6 +234,26 @@ let { log, sin, cos } = Math;
258234

259235
上面代码将Math对象的对数、正弦、余弦三个方法,赋值到对应的变量上,使用起来就会方便很多。
260236

237+
## 字符串的解构赋值
238+
239+
字符串也可以解构赋值。这是因为此时,字符串被转换成了一个类似数组的对象。
240+
241+
```javascript
242+
const [a, b, c, d, e] = 'hello';
243+
a // "h"
244+
b // "e"
245+
c // "l"
246+
d // "l"
247+
e // "o"
248+
```
249+
250+
类似数组的对象都有一个length属性,因此还可以对这个属性解构赋值。
251+
252+
```javascript
253+
let {length : len} = 'hello';
254+
len // 5
255+
```
256+
261257
## 函数参数的解构赋值
262258

263259
函数的参数也可以使用解构。
@@ -302,6 +298,67 @@ move(); // [0, 0]
302298

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

301+
## 圆括号问题
302+
303+
解构赋值虽然很方便,但是解析起来并不容易。对于编译器来说,一个式子到底是模式,还是表达式,没有办法从一开始就知道,必须解析到(或解析不到)等号才能知道。
304+
305+
由此带来的问题是,如果模式中出现圆括号怎么处理。解构赋值的规则是,只要有可能导致解构的歧义,就不得使用圆括号。
306+
307+
但是,这条规则实际上不那么容易辨别,处理起来相当麻烦。因此,建议只要有可能,就不要在模式中放置圆括号。
308+
309+
### 不能使用圆括号的情况
310+
311+
以下三种解构赋值不得使用圆括号。
312+
313+
(1)变量声明语句中,模式不能带有圆括号。
314+
315+
```javascript
316+
// 全部报错
317+
var [(a)] = [1];
318+
var { x: (c) } = {};
319+
var { o: ({ p: p }) } = { o: { p: 2 } };
320+
```
321+
322+
上面三个语句都会报错,因为它们都是变量声明语句,模式不能使用圆括号。
323+
324+
(2)函数参数中,模式不能带有圆括号。
325+
326+
函数参数也属于变量声明,因此不能带有圆括号。
327+
328+
```javascript
329+
// 报错
330+
function f([(z)]) { return z; }
331+
```
332+
333+
(3)不能将整个模式,或嵌套模式中的一层,放在圆括号之中。
334+
335+
```javascript
336+
// 全部报错
337+
({ p: a }) = { p: 42 };
338+
([a]) = [5];
339+
```
340+
341+
上面代码将整个模式放在模式之中,导致报错。
342+
343+
```javascript
344+
// 报错
345+
[({ p: a }), { x: c }] = [{}, {}];
346+
```
347+
348+
上面代码将嵌套模式的一层,放在圆括号之中,导致报错。
349+
350+
### 可以使用圆括号的情况
351+
352+
可以使用圆括号的情况只有一种:赋值语句的非模式部分,可以使用圆括号。
353+
354+
```javascript
355+
[(b)] = [3]; // 正确
356+
({ p: (d) } = {}); // 正确
357+
[(parseInt.prop)] = [3]; // 正确
358+
```
359+
360+
上面三行语句都可以正确执行,因为首先它们都是赋值语句,而不是声明语句;其次它们的圆括号都不属于模式的一部分。第一行语句中,模式是取数组的第一个成员,跟圆括号无关;第二行语句中,模式是p,而不是d;第三行语句与第一行语句的性质一致。
361+
305362
## 用途
306363

307364
变量的解构赋值用途很多。

docs/function.md

Lines changed: 14 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -565,7 +565,6 @@ var result = values.sort((a, b) => a - b);
565565
下面是rest参数与箭头函数结合的例子。
566566

567567
```javascript
568-
569568
const numbers = (...nums) => nums;
570569

571570
numbers(1, 2, 3, 4, 5)
@@ -575,7 +574,6 @@ const headAndTail = (head, ...tail) => [head, tail];
575574

576575
headAndTail(1, 2, 3, 4, 5)
577576
// [1,[2,3,4,5]]
578-
579577
```
580578

581579
箭头函数有几个使用注意点。
@@ -673,10 +671,23 @@ foo::bar;
673671
bar.call(foo);
674672

675673
foo::bar(...arguments);
676-
// 等同于
674+
i// 等同于
677675
bar.apply(foo, arguments);
678676
```
679677

678+
箭头函数还有一个功能,就是可以很方便地改写λ微积分。
679+
680+
```javascript
681+
// λ微积分的写法
682+
fix = λf.(λx.fv.x(x)(v)))(λx.fv.x(x)(v)))
683+
684+
// ES6的写法
685+
var fix = f => (x => f(v => x(x)(v)))
686+
(x => f(v => x(x)(v)));
687+
```
688+
689+
上面两种写法,几乎是一一对应的。由于λ微积分对于计算机科学非常重要,这使得我们可以用ES6作为替代工具,探索计算机科学。
690+
680691
## 尾调用优化
681692

682693
### 什么是尾调用?

0 commit comments

Comments
 (0)