箭头函数和普通函数中this的指向问题

箭头函数和普通函数中this的指向问题

先来两坨代码块

                    var obj = {
                a:100,
                say :  function() {
                    console.log(this);//{a: 100, say: ƒ}
                    console.log(this.a);//100
                }
            }
            obj.say();

            var a =999;
            var obj = {
                a:100,
                say :  ()=> {
                    console.log(this);//Window {parent: Window, opener: null, top: Window, length: 0, frames: Window, …}
                    console.log(this.a);//undefined
                }
            }
            obj.say();

先看第一个代码块，因为里面的函数是obj的一个方法，所以this应该指向的是obj这个对象，所以第一个输出obj的所有对象，第二个输出obj里面的a的值。
在这里特别声明：如果函数直接在全局变量里面就直接指向window，如果是对象的方法，就指向执行环境，就是他在的对象。

再来看第二个代码块，因为使用的是箭头函数，所以，里面是没有this的（就在这里与普通函数不一样。）第一个里面的this输出的时候先去找函数里面有没有this，发现没有就一直往上面寻找，直到找到window。所以输出的是window里面的值。
第二个输出结果是undefined，这里的this空间是真实存在的，只是this空间里面没有a这个属性，所以没有报错，只是输出的是undefined。
报错的情况是什么？比如你去找寻a的时候发现a没有定义，此时就应该报错了。

如果代码是这样的：

            var a =999;
            var obj = {
                a:100,
                say :  ()=> {
                    console.log(this);//Window {parent: Window, opener: null, top: Window, length: 0, frames: Window, …}
                    console.log(this.a);//999
                }
            }
            obj.say();

最后输出的就是999.此时window里面定义了一个a的值，并且是999所以就应该输出的是999.就相当于，window.a
总结一下：此类知识点，个人认为先去找到对象，把this等价代换就很方便理解了。比如obj.a window.a