Skip to content

Commit 8ab3b0a

Browse files
committed
docs(object): edit object/for...of
1 parent 08e0824 commit 8ab3b0a

File tree

1 file changed

+23
-29
lines changed

1 file changed

+23
-29
lines changed

docs/iterator.md

Lines changed: 23 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -581,7 +581,7 @@ for (let i of arr) {
581581

582582
### Set和Map结构
583583

584-
Set和Map结构也原生具有Iterator接口,可以直接使用`for...of`循环。
584+
Set 和 Map 结构也原生具有 Iterator 接口,可以直接使用`for...of`循环。
585585

586586
```javascript
587587
var engines = new Set(["Gecko", "Trident", "Webkit", "Webkit"]);
@@ -604,7 +604,7 @@ for (var [name, value] of es6) {
604604
// standard: ECMA-262
605605
```
606606

607-
上面代码演示了如何遍历Set结构和Map结构。值得注意的地方有两个,首先,遍历的顺序是按照各个成员被添加进数据结构的顺序。其次,Set结构遍历时,返回的是一个值,而Map结构遍历时,返回的是一个数组,该数组的两个成员分别为当前Map成员的键名和键值
607+
上面代码演示了如何遍历 Set 结构和 Map 结构。值得注意的地方有两个,首先,遍历的顺序是按照各个成员被添加进数据结构的顺序。其次,Set 结构遍历时,返回的是一个值,而 Map 结构遍历时,返回的是一个数组,该数组的两个成员分别为当前 Map 成员的键名和键值
608608

609609
```javascript
610610
let map = new Map().set('a', 1).set('b', 2);
@@ -623,9 +623,9 @@ for (let [key, value] of map) {
623623

624624
### 计算生成的数据结构
625625

626-
有些数据结构是在现有数据结构的基础上,计算生成的。比如,ES6的数组、Set、Map都部署了以下三个方法,调用后都返回遍历器对象。
626+
有些数据结构是在现有数据结构的基础上,计算生成的。比如,ES6的数组、Set、Map 都部署了以下三个方法,调用后都返回遍历器对象。
627627

628-
- `entries()` 返回一个遍历器对象,用来遍历`[键名, 键值]`组成的数组。对于数组,键名就是索引值;对于Set,键名与键值相同。Map结构的iterator接口,默认就是调用entries方法
628+
- `entries()` 返回一个遍历器对象,用来遍历`[键名, 键值]`组成的数组。对于数组,键名就是索引值;对于 Set,键名与键值相同。Map 结构的 Iterator 接口,默认就是调用`entries`方法
629629
- `keys()` 返回一个遍历器对象,用来遍历所有的键名。
630630
- `values()` 返回一个遍历器对象,用来遍历所有的键值。
631631

@@ -643,7 +643,7 @@ for (let pair of arr.entries()) {
643643

644644
### 类似数组的对象
645645

646-
类似数组的对象包括好几类。下面是`for...of`循环用于字符串、DOM NodeList对象、arguments对象的例子
646+
类似数组的对象包括好几类。下面是`for...of`循环用于字符串、DOM NodeList 对象、`arguments`对象的例子
647647

648648
```javascript
649649
// 字符串
@@ -671,7 +671,7 @@ printArgs('a', 'b');
671671
// 'b'
672672
```
673673

674-
对于字符串来说,`for...of`循环还有一个特点,就是会正确识别32位UTF-16字符
674+
对于字符串来说,`for...of`循环还有一个特点,就是会正确识别32位 UTF-16 字符
675675

676676
```javascript
677677
for (let x of 'a\uD83D\uDC0A') {
@@ -681,7 +681,7 @@ for (let x of 'a\uD83D\uDC0A') {
681681
// '\uD83D\uDC0A'
682682
```
683683

684-
并不是所有类似数组的对象都具有iterator接口,一个简便的解决方法,就是使用Array.from方法将其转为数组
684+
并不是所有类似数组的对象都具有 Iterator 接口,一个简便的解决方法,就是使用`Array.from`方法将其转为数组
685685

686686
```javascript
687687
let arrayLike = { length: 2, 0: 'a', 1: 'b' };
@@ -699,10 +699,10 @@ for (let x of Array.from(arrayLike)) {
699699

700700
### 对象
701701

702-
对于普通的对象,`for...of`结构不能直接使用,会报错,必须部署了iterator接口后才能使用。但是,这样情况下,`for...in`循环依然可以用来遍历键名。
702+
对于普通的对象,`for...of`结构不能直接使用,会报错,必须部署了 Iterator 接口后才能使用。但是,这样情况下,`for...in`循环依然可以用来遍历键名。
703703

704704
```javascript
705-
var es6 = {
705+
let es6 = {
706706
edition: 6,
707707
committee: "TC39",
708708
standard: "ECMA-262"
@@ -727,18 +727,11 @@ for (let e of es6) {
727727

728728
```javascript
729729
for (var key of Object.keys(someObject)) {
730-
console.log(key + ": " + someObject[key]);
730+
console.log(key + ': ' + someObject[key]);
731731
}
732732
```
733733

734-
在对象上部署iterator接口的代码,参见本章前面部分。一个方便的方法是将数组的`Symbol.iterator`属性,直接赋值给其他对象的`Symbol.iterator`属性。比如,想要让`for...of`环遍历jQuery对象,只要加上下面这一行就可以了。
735-
736-
```javascript
737-
jQuery.prototype[Symbol.iterator] =
738-
Array.prototype[Symbol.iterator];
739-
```
740-
741-
另一个方法是使用Generator函数将对象重新包装一下。
734+
另一个方法是使用 Generator 函数将对象重新包装一下。
742735

743736
```javascript
744737
function* entries(obj) {
@@ -748,7 +741,7 @@ function* entries(obj) {
748741
}
749742

750743
for (let [key, value] of entries(obj)) {
751-
console.log(key, "->", value);
744+
console.log(key, '->', value);
752745
}
753746
// a -> 1
754747
// b -> 2
@@ -757,23 +750,23 @@ for (let [key, value] of entries(obj)) {
757750

758751
### 与其他遍历语法的比较
759752

760-
以数组为例,JavaScript提供多种遍历语法。最原始的写法就是for循环
753+
以数组为例,JavaScript 提供多种遍历语法。最原始的写法就是`for`循环
761754

762755
```javascript
763756
for (var index = 0; index < myArray.length; index++) {
764757
console.log(myArray[index]);
765758
}
766759
```
767760

768-
这种写法比较麻烦,因此数组提供内置的forEach方法
761+
这种写法比较麻烦,因此数组提供内置的`forEach`方法
769762

770763
```javascript
771764
myArray.forEach(function (value) {
772765
console.log(value);
773766
});
774767
```
775768

776-
这种写法的问题在于,无法中途跳出`forEach`循环,break命令或return命令都不能奏效
769+
这种写法的问题在于,无法中途跳出`forEach`循环,`break`命令或`return`命令都不能奏效
777770

778771
`for...in`循环可以遍历数组的键名。
779772

@@ -783,11 +776,11 @@ for (var index in myArray) {
783776
}
784777
```
785778

786-
for...in循环有几个缺点
779+
`for...in`循环有几个缺点
787780

788-
- 数组的键名是数字,但是for...in循环是以字符串作为键名“0”、“1”、“2”等等。
789-
- for...in循环不仅遍历数字键名,还会遍历手动添加的其他键,甚至包括原型链上的键。
790-
- 某些情况下,for...in循环会以任意顺序遍历键名
781+
- 数组的键名是数字,但是`for...in`循环是以字符串作为键名“0”、“1”、“2”等等。
782+
- `for...in`循环不仅遍历数字键名,还会遍历手动添加的其他键,甚至包括原型链上的键。
783+
- 某些情况下,`for...in`循环会以任意顺序遍历键名
791784

792785
总之,`for...in`循环主要是为遍历对象而设计的,不适用于遍历数组。
793786

@@ -799,8 +792,8 @@ for (let value of myArray) {
799792
}
800793
```
801794

802-
- 有着同for...in一样的简洁语法,但是没有for...in那些缺点
803-
- 不同用于forEach方法,它可以与break、continue和return配合使用
795+
- 有着同`for...in`一样的简洁语法,但是没有`for...in`那些缺点
796+
- 不同用于`forEach`方法,它可以与`break``continue``return`配合使用
804797
- 提供了遍历所有数据结构的统一操作接口。
805798

806799
下面是一个使用break语句,跳出`for...of`循环的例子。
@@ -813,4 +806,5 @@ for (var n of fibonacci) {
813806
}
814807
```
815808

816-
上面的例子,会输出斐波纳契数列小于等于1000的项。如果当前项大于1000,就会使用break语句跳出`for...of`循环。
809+
上面的例子,会输出斐波纳契数列小于等于1000的项。如果当前项大于1000,就会使用`break`语句跳出`for...of`循环。
810+

0 commit comments

Comments
 (0)