mirror of
https://github.com/ruanyf/es6tutorial.git
synced 2024-04-21 12:32:22 +00:00
edit function/spread
This commit is contained in:
+35
-7
@@ -5,8 +5,16 @@
|
||||
Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括ES6新增的数据结构Set和Map)。
|
||||
|
||||
```javascript
|
||||
let ps = document.querySelectorAll('p');
|
||||
Array.from('hello')
|
||||
// ['h', 'e', 'l', 'l', 'o']
|
||||
|
||||
Array.from([1, 2, 3])
|
||||
// [1, 2, 3]
|
||||
|
||||
let namesSet = new Set(['a', 'b'])
|
||||
Array.from(namesSet) // ['a', 'b']
|
||||
|
||||
let ps = document.querySelectorAll('p');
|
||||
Array.from(ps).forEach(function (p) {
|
||||
console.log(p);
|
||||
});
|
||||
@@ -45,6 +53,9 @@ Array.from()还可以接受第二个参数,作用类似于数组的map方法
|
||||
Array.from(arrayLike, x => x * x);
|
||||
// 等同于
|
||||
Array.from(arrayLike).map(x => x * x);
|
||||
|
||||
Array.from([1, 2, 3], (x) => x * x)
|
||||
// [1, 4, 9]
|
||||
```
|
||||
|
||||
下面的例子将数组中布尔值为false的成员转为0。
|
||||
@@ -54,7 +65,16 @@ Array.from([1, , 2, , 3], (n) => n || 0)
|
||||
// [1, 0, 2, 0, 3]
|
||||
```
|
||||
|
||||
Array.from()的一个应用是,将字符串转为数组,然后返回字符串的长度。这样可以避免JavaScript将大于\uFFFF的Unicode字符,算作两个字符的bug。
|
||||
`Array.from()`可以将各种值转为真正的数组,并且还提供map功能。这实际上意味着,你可以在数组里造出任何想要的值。
|
||||
|
||||
```javascript
|
||||
Array.from({ length: 2 }, () => 'jack')
|
||||
// ['jack', 'jack']
|
||||
```
|
||||
|
||||
上面代码中,`Array.from`的第一个参数指定了第二个参数运行的次数。这种特性可以让该方法的用法变得非常灵活。
|
||||
|
||||
`Array.from()`的另一个应用是,将字符串转为数组,然后返回字符串的长度。这样可以避免JavaScript将大于`\uFFFF`的Unicode字符,算作两个字符的bug。
|
||||
|
||||
```javascript
|
||||
function countSymbols(string) {
|
||||
@@ -95,8 +115,8 @@ function ArrayOf(){
|
||||
数组实例的find方法,用于找出第一个符合条件的数组成员。它的参数是一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回值为true的成员,然后返回该成员。如果没有符合条件的成员,则返回undefined。
|
||||
|
||||
```javascript
|
||||
var found = [1, 4, -5, 10].find((n) => n < 0);
|
||||
console.log("found:", found);
|
||||
[1, 4, -5, 10].find((n) => n < 0)
|
||||
// -5
|
||||
```
|
||||
|
||||
上面代码找出数组中第一个小于0的成员。
|
||||
@@ -129,7 +149,7 @@ console.log("found:", found);
|
||||
// 0
|
||||
```
|
||||
|
||||
上面代码中,indexOf方法无法识别数组的NaN成员,但是findIndex方法可以借助Object.is方法做到。
|
||||
上面代码中,`indexOf`方法无法识别数组的NaN成员,但是`findIndex`方法可以借助`Object.is`方法做到。
|
||||
|
||||
## 数组实例的fill()
|
||||
|
||||
@@ -156,10 +176,9 @@ fill()还可以接受第二个和第三个参数,用于指定填充的起始
|
||||
|
||||
## 数组实例的entries(),keys()和values()
|
||||
|
||||
ES6提供三个新的方法——entries(),keys()和values()——用于遍历数组。它们都返回一个遍历器,可以用for...of循环进行遍历,唯一的区别是keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历。
|
||||
ES6提供三个新的方法——`entries()`,`keys()`和`values()`——用于遍历数组。它们都返回一个遍历器对象(详见《Iterator》一章),可以用`for...of`循环进行遍历,唯一的区别是`keys()`是对键名的遍历、`values()`是对键值的遍历,`entries()`是对键值对的遍历。
|
||||
|
||||
```javascript
|
||||
|
||||
for (let index of ['a', 'b'].keys()) {
|
||||
console.log(index);
|
||||
}
|
||||
@@ -177,7 +196,16 @@ for (let [index, elem] of ['a', 'b'].entries()) {
|
||||
}
|
||||
// 0 "a"
|
||||
// 1 "b"
|
||||
```
|
||||
|
||||
如果不使用`for...of`循环,可以手动调用遍历器对象的`next`方法,进行遍历。
|
||||
|
||||
```javascript
|
||||
let letter = ['a', 'b', 'c'];
|
||||
let entries = letter.entries();
|
||||
console.log(entries.next().value); // [0, 'a']
|
||||
console.log(entries.next().value); // [1, 'b']
|
||||
console.log(entries.next().value); // [2, 'c']
|
||||
```
|
||||
|
||||
## 数组实例的includes()
|
||||
|
||||
Reference in New Issue
Block a user