docs(function): edit arrow function

ruanyf · ruanyf · commit c9eb39a92f87 · 2020-12-17T15:56:03.000+08:00
diff --git a/docs/function.md b/docs/function.md
@@ -869,6 +869,35 @@ const cat = {
 
 上面代码中，`cat.jumps()`方法是一个箭头函数，这是错误的。调用`cat.jumps()`时，如果是普通函数，该方法内部的`this`指向`cat`；如果写成上面那样的箭头函数，使得`this`指向全局对象，因此不会得到预期结果。这是因为对象不构成单独的作用域，导致`jumps`箭头函数定义时的作用域就是全局作用域。
 
+再看一个例子。
+
+```javascript
+globalThis.s = 21;
+
+const obj = {
+  s: 42,
+  m: () => console.log(this.s)
+};
+
+obj.m() // 21
+```
+
+上面例子中，`obj.m()`使用箭头函数定义。JavaScript 引擎的处理方法是，先在全局空间生成这个箭头函数，然后赋值给`obj.m`，这导致箭头函数内部的`this`指向全局对象，所以`obj.m()`输出的是全局空间的`21`，而不是对象内部的`42`。上面的代码实际上等同于下面的代码。
+
+```javascript
+globalThis.s = 21;
+globalThis.m = () => console.log(this.s);
+
+const obj = {
+  s: 42,
+  m: globalThis.m
+};
+
+obj.m() // 21
+```
+
+由于上面这个原因，对象的属性建议使用传统的写法定义，不要用箭头函数定义。
+
 第二个场合是需要动态`this`的时候，也不应使用箭头函数。
 
 ```javascript
