1
0
mirror of https://github.com/ruanyf/es6tutorial.git synced 2025-05-24 18:32:22 +00:00

edit array & iterator

This commit is contained in:
Ruan Yifeng 2015-06-05 07:20:52 +08:00
parent 9638862076
commit db07394071
2 changed files with 55 additions and 22 deletions

View File

@ -2,7 +2,7 @@
## Array.from()
Array.from()用于将两类对象转为真正的数组类似数组的对象array-like object和可遍历iterable的对象其中包括ES6新增的Set和Map结构
Array.from方法用于将两类对象转为真正的数组类似数组的对象array-like object和可遍历iterable的对象包括ES6新增的数据结构Set和Map
```javascript
@ -57,19 +57,24 @@ Array.from(arrayLike).map(x => x * x);
```
下面的例子将数组中布尔值为false的成员转为0。
```javascript
Array.from([1, , 2, , 3], (n) => n || 0)
// [1, 0, 2, 0, 3]
```
Array.from()的一个应用是将字符串转为数组然后返回字符串的长度。这样可以避免JavaScript将大于\uFFFF的Unicode字符算作两个字符的bug。
```javascript
function countSymbols(string) {
return Array.from(string).length;
}
```
## Array.of()
Array.of()方法用于将一组值,转换为数组。
Array.of方法用于将一组值转换为数组。
```javaScript
@ -82,53 +87,64 @@ Array.of(3).length // 1
这个方法的主要目的是弥补数组构造函数Array()的不足。因为参数个数的不同会导致Array()的行为有差异。
```javascript
Array() // []
Array(3) // [undefined, undefined, undefined]
Array(3,11,8) // [3, 11, 8]
```
上面代码说明只有当参数个数不少于2个Array()才会返回由参数组成的新数组。
## 数组实例的find()和findIndex()
数组实例的find()用于找出第一个符合条件的数组元素。它的参数是一个回调函数所有数组元素依次遍历该回调函数直到找出第一个返回值为true的元素然后返回该元素否则返回undefined。
Array.of方法可以用下面的代码模拟实现。
```javascript
[1, 5, 10, 15].find(function(value, index, arr) {
return value > 9;
}) // 10
function ArrayOf(){
return [].slice.call(arguments);
}
```
从上面代码可以看到,回调函数接受三个参数,依次为当前的值、当前的位置和原数组。
## 数组实例的find()和findIndex()
数组实例的findIndex()的用法与find()非常类似,返回第一个符合条件的数组元素的位置,如果所有元素都不符合条件,则返回-1。
数组实例的find方法用于找出第一个符合条件的数组成员。它的参数是一个回调函数所有数组成员依次执行该回调函数直到找出第一个返回值为true的成员然后返回该成员。如果没有符合条件的成员则返回undefined。
```javascript
var found = [1, 4, -5, 10].find((n) => n < 0);
console.log("found:", found);
```
上面代码找出数组中第一个小于0的成员。
```javascript
[1, 5, 10, 15].find(function(value, index, arr) {
return value > 9;
}) // 10
```
上面代码中find方法的回调函数可以接受三个参数依次为当前的值、当前的位置和原数组。
数组实例的findIndex方法的用法与find方法非常类似返回第一个符合条件的数组成员的位置如果所有成员都不符合条件则返回-1。
```javascript
[1, 5, 10, 15].findIndex(function(value, index, arr) {
return value > 9;
}) // 2
return value > 9;
}) // 2
```
这两个方法都可以接受第二个参数用来绑定回调函数的this对象。
另外这两个方法都可以发现NaN弥补了IndexOf()的不足。
另外这两个方法都可以发现NaN弥补了数组的IndexOf方法的不足。
```javascript
[NaN].indexOf(NaN)
[NaN].indexOf(NaN)
// -1
[NaN].findIndex(y => Object.is(NaN, y))
// 0
```
上面代码中indexOf方法无法识别数组的NaN成员但是findIndex方法可以借助Object.is方法做到。
## 数组实例的fill()
fill()使用给定值,填充一个数组。

View File

@ -655,6 +655,23 @@ jQuery.prototype[Symbol.iterator] =
Array.prototype[Symbol.iterator];
```
另一个方法是使用Generator函数将对象重新包装一下。
```javascript
function* entries(obj) {
for (let key of Object.keys(obj)) {
yield [key, obj[key]];
}
}
for (let [key, value] of entries(obj)) {
console.log(key, "->", value);
}
// a -> 1
// b -> 2
// c -> 3
```
### 与其他遍历语法的比较
以数组为例JavaScript提供多种遍历语法。最原始的写法就是for循环。