book/es6tutorial
1
0
Fork 0
mirror of https://github.com/ruanyf/es6tutorial.git synced 2025-05-24 18:32:22 +00:00
Code Issues Releases Wiki Activity

docs(function): edit arrow function

Browse Source
This commit is contained in:
ruanyf 2017-05-26 17:25:33 +08:00
parent 0842b12577
commit 23c05f8244
1 changed files with 8 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
docs/function.md
View File

@ -225,7 +225,7 @@ foo(undefined, null)
上面代码中，`length`属性的返回值，等于函数的参数个数减去指定了默认值的参数个数。比如，上面最后一个函数，定义了3个参数，其中有一个参数`c`指定了默认值，因此`length`属性等于`3`减去`1`，最后得到`2`。 上面代码中，`length`属性的返回值，等于函数的参数个数减去指定了默认值的参数个数。比如，上面最后一个函数，定义了3个参数，其中有一个参数`c`指定了默认值，因此`length`属性等于`3`减去`1`，最后得到`2`。
这是因为`length`属性的含义是，该函数预期传入的参数个数。某个参数指定默认值以后，预期传入的参数个数就不包括这个参数了。同理，rest参数也不会计入`length`属性。 这是因为`length`属性的含义是，该函数预期传入的参数个数。某个参数指定默认值以后，预期传入的参数个数就不包括这个参数了。同理，rest 参数也不会计入`length`属性。
```javascript ```javascript
(function(...args) {}).length // 0 (function(...args) {}).length // 0
@ -937,7 +937,7 @@ var result = values.sort(function (a, b) {
var result = values.sort((a, b) => a - b); var result = values.sort((a, b) => a - b);
``` ```
下面是rest参数与箭头函数结合的例子。 下面是 rest 参数与箭头函数结合的例子。
```javascript ```javascript
const numbers = (...nums) => nums; const numbers = (...nums) => nums;
@ -959,9 +959,9 @@ headAndTail(1, 2, 3, 4, 5)
（2）不可以当作构造函数，也就是说，不可以使用`new`命令，否则会抛出一个错误。 （2）不可以当作构造函数，也就是说，不可以使用`new`命令，否则会抛出一个错误。
（3）不可以使用`arguments`对象，该对象在函数体内不存在。如果要用，可以用Rest参数代替。 （3）不可以使用`arguments`对象，该对象在函数体内不存在。如果要用，可以用 rest 参数代替。
（4）不可以使用`yield`命令，因此箭头函数不能用作Generator函数。 （4）不可以使用`yield`命令，因此箭头函数不能用作 Generator 函数。
上面四点中，第一点尤其值得注意。`this`对象的指向是可变的，但是在箭头函数中，它是固定的。 上面四点中，第一点尤其值得注意。`this`对象的指向是可变的，但是在箭头函数中，它是固定的。
@ -1004,7 +1004,7 @@ setTimeout(() => console.log('s2: ', timer.s2), 3100);
上面代码中，`Timer`函数内部设置了两个定时器，分别使用了箭头函数和普通函数。前者的`this`绑定定义时所在的作用域（即`Timer`函数），后者的`this`指向运行时所在的作用域（即全局对象）。所以，3100毫秒之后，`timer.s1`被更新了3次，而`timer.s2`一次都没更新。 上面代码中，`Timer`函数内部设置了两个定时器，分别使用了箭头函数和普通函数。前者的`this`绑定定义时所在的作用域（即`Timer`函数），后者的`this`指向运行时所在的作用域（即全局对象）。所以，3100毫秒之后，`timer.s1`被更新了3次，而`timer.s2`一次都没更新。
箭头函数可以让`this`指向固定化，这种特性很有利于封装回调函数。下面是一个例子，DOM事件的回调函数封装在一个对象里面。 箭头函数可以让`this`指向固定化，这种特性很有利于封装回调函数。下面是一个例子，DOM 事件的回调函数封装在一个对象里面。
```javascript ```javascript
var handler = { var handler = {
@ -1025,7 +1025,7 @@ var handler = {
`this`指向的固定化，并不是因为箭头函数内部有绑定`this`的机制，实际原因是箭头函数根本没有自己的`this`，导致内部的`this`就是外层代码块的`this`。正是因为它没有`this`，所以也就不能用作构造函数。 `this`指向的固定化，并不是因为箭头函数内部有绑定`this`的机制，实际原因是箭头函数根本没有自己的`this`，导致内部的`this`就是外层代码块的`this`。正是因为它没有`this`，所以也就不能用作构造函数。
所以，箭头函数转成ES5的代码如下。 所以，箭头函数转成 ES5 的代码如下。
```javascript ```javascript
// ES6 // ES6
@ -1097,11 +1097,11 @@ foo(2, 4, 6, 8)
上面代码中，箭头函数没有自己的`this`，所以`bind`方法无效，内部的`this`指向外部的`this`。 上面代码中，箭头函数没有自己的`this`，所以`bind`方法无效，内部的`this`指向外部的`this`。
长期以来，JavaScript语言的`this`对象一直是一个令人头痛的问题，在对象方法中使用`this`，必须非常小心。箭头函数”绑定”`this`，很大程度上解决了这个困扰。 长期以来，JavaScript 语言的`this`对象一直是一个令人头痛的问题，在对象方法中使用`this`，必须非常小心。箭头函数”绑定”`this`，很大程度上解决了这个困扰。
### 嵌套的箭头函数 ### 嵌套的箭头函数
箭头函数内部，还可以再使用箭头函数。下面是一个ES5语法的多重嵌套函数。 箭头函数内部，还可以再使用箭头函数。下面是一个 ES5 语法的多重嵌套函数。
```javascript ```javascript
function insert(value) { function insert(value) {