Skip to content

Commit 5c7390c

Browse files
committed
edit destructuring/string default
1 parent 68b9867 commit 5c7390c

File tree

2 files changed

+30
-32
lines changed

2 files changed

+30
-32
lines changed

docs/destructuring.md

Lines changed: 20 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -7,19 +7,15 @@ ES6允许按照一定模式,从数组和对象中提取值,对变量进行
77
以前,为变量赋值,只能直接指定值。
88

99
```javascript
10-
1110
var a = 1;
1211
var b = 2;
1312
var c = 3;
14-
1513
```
1614

1715
ES6允许写成下面这样。
1816

1917
```javascript
20-
2118
var [a, b, c] = [1, 2, 3];
22-
2319
```
2420

2521
上面代码表示,可以从数组中提取值,按照对应位置,对变量赋值。
@@ -49,22 +45,19 @@ tail // [2, 3, 4]
4945
如果解构不成功,变量的值就等于undefined。
5046

5147
```javascript
52-
5348
var [foo] = [];
5449
var [foo] = 1;
5550
var [foo] = 'Hello';
5651
var [foo] = false;
5752
var [foo] = NaN;
5853
var [bar, foo] = [1];
59-
6054
```
6155

6256
以上几种情况都属于解构不成功,foo的值都会等于undefined。这是因为原始类型的值,会自动转为对象,比如数值1转为`new Number(1)`,从而导致foo取到undefined。
6357

6458
另一种情况是不完全解构,即等号左边的模式,只匹配一部分的等号右边的数组。这种情况下,解构依然可以成功。
6559

6660
```javascript
67-
6861
let [x, y] = [1, 2, 3];
6962
x // 1
7063
y // 2
@@ -80,44 +73,36 @@ d // 4
8073
如果对undefined或null进行解构,会报错。
8174

8275
```javascript
83-
8476
// 报错
8577
var [foo] = undefined;
8678
var [foo] = null;
87-
8879
```
8980

9081
这是因为解构只能用于数组或对象。其他原始类型的值都可以转为相应的对象,但是,undefined和null不能转为对象,因此报错。
9182

9283
解构赋值允许指定默认值。
9384

9485
```javascript
95-
9686
var [foo = true] = [];
9787
foo // true
9888

9989
[x, y='b'] = ['a'] // x='a', y='b'
10090
[x, y='b'] = ['a', undefined] // x='a', y='b'
101-
10291
```
10392

10493
解构赋值不仅适用于var命令,也适用于let和const命令。
10594

10695
```javascript
107-
10896
var [v1, v2, ..., vN ] = array;
10997
let [v1, v2, ..., vN ] = array;
11098
const [v1, v2, ..., vN ] = array;
111-
11299
```
113100

114101
对于Set结构,也可以使用数组的解构赋值。
115102

116103
```javascript
117-
118104
[a, b, c] = new Set(["a", "b", "c"])
119105
a // "a"
120-
121106
```
122107

123108
事实上,只要某种数据结构具有Iterator接口,都可以采用数组形式的解构赋值。
@@ -138,6 +123,26 @@ sixth // 5
138123

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

126+
## 字符串的解构赋值
127+
128+
由于JavaScript引擎内部,某些场合时,字符串会被转为类似数组的对象。因此,字符串也可以解构赋值。
129+
130+
```javascript
131+
const [a, b, c, d, e] = 'hello';
132+
a // "h"
133+
b // "e"
134+
c // "l"
135+
d // "l"
136+
e // "o"
137+
```
138+
139+
类似数组的对象都有一个length属性,因此还可以对这个属性结构赋值。
140+
141+
```javascript
142+
let {length : len} = 'hello';
143+
len // 5
144+
```
145+
141146
## 对象的解构赋值
142147

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

docs/function.md

Lines changed: 10 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -493,25 +493,20 @@ var go = function*(){
493493
ES6允许使用“箭头”(=>)定义函数。
494494

495495
```javascript
496-
497496
var f = v => v;
498-
499497
```
500498

501499
上面的箭头函数等同于:
502500

503501
```javascript
504-
505502
var f = function(v) {
506503
return v;
507504
};
508-
509505
```
510506

511507
如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分。
512508

513509
```javascript
514-
515510
var f = () => 5;
516511
// 等同于
517512
var f = function (){ return 5 };
@@ -521,62 +516,62 @@ var sum = (num1, num2) => num1 + num2;
521516
var sum = function(num1, num2) {
522517
return num1 + num2;
523518
};
524-
525519
```
526520

527521
如果箭头函数的代码块部分多于一条语句,就要使用大括号将它们括起来,并且使用return语句返回。
528522

529523
```javascript
530-
531524
var sum = (num1, num2) => { return num1 + num2; }
532-
533525
```
534526

535527
由于大括号被解释为代码块,所以如果箭头函数直接返回一个对象,必须在对象外面加上括号。
536528

537529
```javascript
538-
539530
var getTempItem = id => ({ id: id, name: "Temp" });
531+
```
532+
533+
箭头函数可以与变量解构结合使用。
540534

535+
```javascript
536+
const full = ({ first, last }) => first + ' ' + last;
537+
538+
// 等同于
539+
function full( person ){
540+
return person.first + ‘ ‘ + person.name;
541+
}
541542
```
542543

543544
箭头函数使得表达更加简洁。
544545

545546
```javascript
546-
547547
const isEven = n => n % 2 == 0;
548548
const square = n => n * n;
549-
550549
```
551550

552551
上面代码只用了两行,就定义了两个简单的工具函数。如果不用箭头函数,可能就要占用多行,而且还不如现在这样写醒目。
553552

554553
箭头函数的一个用处是简化回调函数。
555554

556555
```javascript
557-
558556
// 正常函数写法
559557
[1,2,3].map(function (x) {
560558
return x * x;
561559
});
562560

563561
// 箭头函数写法
564562
[1,2,3].map(x => x * x);
565-
566563
```
567564

568565
另一个例子是
569566

570567
```javascript
571-
572568
// 正常函数写法
573569
var result = values.sort(function(a, b) {
574570
return a - b;
575571
});
576572

577573
// 箭头函数写法
578574
var result = values.sort((a, b) => a - b);
579-
580575
```
581576

582577
下面是rest参数与箭头函数结合的例子。
@@ -646,13 +641,11 @@ addThenMult(5)
646641
上面的代码等同于下面的写法。
647642

648643
```javascript
649-
650644
const plus1 = a => a + 1;
651645
const mult2 = a => a * 2;
652646

653647
mult2(plus1(5))
654648
// 12
655-
656649
```
657650

658651
## 函数绑定

0 commit comments

Comments
 (0)