From cc2420e644113f25b4598b940dd321a0b5e3b09f Mon Sep 17 00:00:00 2001
From: ruanyf <yifeng.ruan@gmail.com>
Date: Thu, 17 Dec 2020 15:49:41 +0800
Subject: [PATCH] docs(function): edit arrow function

---
 docs/function.md | 29 +++++++++++++++++++++++++++++
 1 file changed, 29 insertions(+)

diff --git a/docs/function.md b/docs/function.md
index fe6b107..792a458 100644
--- 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