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

修改function/rest & spread

This commit is contained in:
Ruan Yifeng 2015-02-04 17:59:15 +08:00
parent b06c2f1f6d
commit d3fa544cea
2 changed files with 64 additions and 0 deletions

View File

@ -239,6 +239,14 @@ add(...numbers) // 42
上面代码中,`array.push(...items)``add(...numbers)`这两行,都是函数的调用,它们的都使用了扩展运算符。该运算符将一个数组,变为参数序列。 上面代码中,`array.push(...items)``add(...numbers)`这两行,都是函数的调用,它们的都使用了扩展运算符。该运算符将一个数组,变为参数序列。
下面是Date函数的参数使用扩展运算符的例子。
```javascript
const date = new Date(...[2015, 1, 1]);
```
由于扩展运算符可以展开数组所以不再需要apply方法将数组转为函数的参数了。 由于扩展运算符可以展开数组所以不再需要apply方法将数组转为函数的参数了。
```javascript ```javascript
@ -318,6 +326,44 @@ d
上面代码其实也提供了,将一个数组拷贝进另一个数组的便捷方法。 上面代码其实也提供了,将一个数组拷贝进另一个数组的便捷方法。
扩展运算符也可以与解构赋值结合起来,用于生成数组。
```javascript
const [first, ...rest] = [1, 2, 3, 4, 5];
first // 1
rest // [2, 3, 4, 5]
const [first, ...rest] = [];
first // undefined
rest // []:
const [first, ...rest] = ["foo"];
first // "foo"
rest // []
const [first, ...rest] = ["foo", "bar"];
first // "foo"
rest // ["bar"]
const [first, ...rest] = ["foo", "bar", "baz"];
first // "foo"
rest // ["bar","baz"]
```
如果将扩展运算符用于数组赋值,只能放在参数的最后一位,否则会报错。
```javascript
const [...butLast, last] = [1, 2, 3, 4, 5];
// 报错
const [first, ..., last] = [1, 2, 3, 4, 5];
// 报错
```
JavaScript的函数只能返回一个值如果需要返回多个值只能返回数组或对象。扩展运算符提供了解决这个问题的一种变通方法。 JavaScript的函数只能返回一个值如果需要返回多个值只能返回数组或对象。扩展运算符提供了解决这个问题的一种变通方法。
```javascript ```javascript
@ -432,6 +478,7 @@ var sum = (num1, num2) => { return num1 + num2; }
var getTempItem = id => ({ id: id, name: "Temp" }); var getTempItem = id => ({ id: id, name: "Temp" });
``` ```
箭头函数的一个用处是简化回调函数。 箭头函数的一个用处是简化回调函数。
```javascript ```javascript
@ -460,6 +507,22 @@ var result = values.sort((a, b) => a - b);
``` ```
下面是rest参数与箭头函数结合的例子。
```javascript
const numbers = (...nums) => nums;
numbers(1, 2, 3, 4, 5)
// [1,2,3,4,5]
const headAndTail = (head, ...tail) => [head, tail];
headAndTail(1, 2, 3, 4, 5)
// [1,[2,3,4,5]]
```
箭头函数有几个使用注意点。 箭头函数有几个使用注意点。
- 函数体内的this对象绑定定义时所在的对象而不是使用时所在的对象。 - 函数体内的this对象绑定定义时所在的对象而不是使用时所在的对象。

View File

@ -33,6 +33,7 @@
- Dmitry Soshnikov, [ES6 Notes: Default values of parameters](http://dmitrysoshnikov.com/ecmascript/es6-notes-default-values-of-parameters/): 介绍参数的默认值 - Dmitry Soshnikov, [ES6 Notes: Default values of parameters](http://dmitrysoshnikov.com/ecmascript/es6-notes-default-values-of-parameters/): 介绍参数的默认值
- Mozilla Developer Network, [WeakSet](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WeakSet)介绍WeakSet数据结构 - Mozilla Developer Network, [WeakSet](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WeakSet)介绍WeakSet数据结构
- Axel Rauschmayer, [ECMAScript 6: maps and sets](http://www.2ality.com/2015/01/es6-maps-sets.html): Set和Map结构的详细介绍 - Axel Rauschmayer, [ECMAScript 6: maps and sets](http://www.2ality.com/2015/01/es6-maps-sets.html): Set和Map结构的详细介绍
- Ragan Wald, [Destructuring and Recursion in ES6](http://raganwald.com/2015/02/02/destructuring.html): rest参数和扩展运算符的详细介绍
## 字符串 ## 字符串