JavaScript中的各种函数以及this指向

1、普通函数

this指向window对象

function fn(){
      console.log(this);  // Window
    }
fn()

2、对象中的方法

this指向该方法的所属对象

const obj = {
      say:function(){
        console.log(this);  //{say: ƒ}
      }
    }
obj.say()

3、构造函数

this指向构造函数的实例化对象（原型上的方法同样如此）

 function Person(){
      Person.prototype.say = function(){
        console.log(this);    // Person {}
      }
    }
 const hzy =new Person()
 hzy.say()

4、绑定事件函数

this指向事件绑定的对象

const btn = document.querySelector('button');
btn.onclick = function(){
       console.log(this);  // <button>123</button>
} 

 5、定时器函数

this指向window对象

setTimeout(() => {
      console.log(this);  // // Window
}, 1000);

6、立即执行函数

this指向window对象

(function(){
      console.log(this); // window
})()

7、箭头函数

箭头函数没有自己this指向，里面的this指向外层作用域（如果箭头函数外层有函数，那么外层函数的this就是箭头函数的this，如果没有，则this指向window）

//箭头函数外层没有函数
let sum = (x,y)=>{
      console.log(this);  //Window
      return x + y;
    }
sum(1,2)
//箭头函数外层有函数
 const btn = document.querySelector('button');
   btn.onclick = function () {
     let sum = (x, y) => {
        console.log(this);  //this指向btn
        return x + y;
     }
     sum(1, 2)
  }