this在标准函数和箭头函数中有不同的行为。
    在标准函数中，this 引用的是把函数当成方法调用的上下文对象，这时候通常称其为 this 值（在网页的全局上下文中调用函数时，this 指向 windows）

    1. window.color = 'red'; 
    2. let o = { 
    3.  color: 'blue' 
    4. }; 
    5. function sayColor() { 
    6.  console.log(this.color); 
    7. } 
    8. sayColor(); // 'red' 
    9. o.sayColor = sayColor; 
    10. o.sayColor(); // 'blue'
    • 定义在全局上下文中的函数 sayColor()引用了 this 对象。
    • 这个 this 到底引用哪个对象必须到函数被调用时才能确定。
    • 因此这个值在代码执行的过程中可能会变。
    • 如果在全局上下文中调用sayColor()，这结果会输出”red”，因为 this 指向 window，而 this.color 相当于 window.color。
    • 而在把 sayColor()赋值给 o 之后再调用 o.sayColor()，this 会指向 o，即 this.color 相当于o.color，所以会显示”blue”。

    在箭头函数中，this引用的是定义箭头函数的上下文。
    下面的例子演示了这一点。在对sayColor()的两次调用中，this 引用的都是 window 对象，因为这个箭头函数是在 window 上下文中定义的：

    1. window.color = 'red'; 
    2. let o = { 
    3.  color: 'blue' 
    4. }; 
    5. let sayColor = () => console.log(this.color); 
    6. sayColor(); // 'red' 
    7. o.sayColor = sayColor; 
    8. o.sayColor(); // 'red'

    在事件回调或定时回调中调用某个函数时，this 值指向的并非想要的对象。
    此时将回调函数写成箭头函数就可以解决问题。这是因为箭头函数中的 this 会保留定义该函数时的上下文：

    1. function King() { 
    2.  this.royaltyName = 'Henry'; 
    3.  // this 引用 King 的实例
    4.  setTimeout(() => console.log(this.royaltyName), 1000); 
    5. }
    6. function Queen() { 
    7.  this.royaltyName = 'Elizabeth'; 
    8.  // this 引用 window 对象
    9.  setTimeout(function() { console.log(this.royaltyName); }, 1000); 
    10. } 
    11. new King(); // Henry 
    12. new Queen(); // undefined

    注意 函数名只是保存指针的变量。因此全局定义的 sayColor()函数和 o.sayColor() 是同一个函数，只不过执行的上下文不同。