this指向面试题

直接上题目

  var name = 'window'

        function Person(name) {
            this.name = name
            this.obj = {
                name: 'obj',
                foo1: function() {
                    return function() {
                        console.log(this.name)
                    }
                },
                foo2: function() {
                    return () => {
                        console.log(this.name)
                    }
                }
            }
        }
        var person1 = new Person('person1')
        var person2 = new Person('person2')

        person1.obj.foo1()() 
        person1.obj.foo1.call(person2)() 
        person1.obj.foo1().call(person2) 

        person1.obj.foo2()() 
        person1.obj.foo2.call(person2)() 
        person1.obj.foo2().call(person2) 

手动分割线

先公布答案给做完的小伙伴

下面我们一个个分析，为了方便我们这里也用代码块写

person1.obj.foo1()()
//一步一步看， person1.obj.foo1()相当于拿到一个return的函数，
//当再次执行的时候相当于在全局执行了function() {console.log(this.name) },全局下name为window
 person1.obj.foo1.call(person2)() 
 //这一条相当于和上一步一样，最终还是拿到一个返回的函数（虽然多了一步call的绑定）
 person1.obj.foo1().call(person2) 
  // person1.obj.foo1()这个操作我们看上面已经知道返回了一个全局作用下的函数
  //在（）的时候call,指针指到person2,此时name 为person2
 person1.obj.foo2()() 
   // person1.obj.foo2()执行时我们得到了一个箭头函数() => {console.log(this.name)}
   //这时在（），像上找一个作用域，这时我们找到了obj这个对象，name为obj 
person1.obj.foo2.call(person2)() 
//person1.obj.foo2.call(person2执行时我们得到了一个箭头函数() => {console.log(this.name)}
//但是由于call导致指针指到person2，所以这时候我i们在执行时，向上找一个作用域找到了person2

person1.obj.foo2().call(person2) 
// person1.obj.foo2()执行时我们得到了一个箭头函数() => {console.log(this.name)}
//下面在call(person2) 的时候箭头函数通过call调用是不会绑定this，向上找一个作用域找到了obj