js中this的总结

59 阅读1分钟

一 :this的定义

this 关键字是函数运行时自动生成的一个内部对象,只能在函数内部使用,总指向调用它的对象

二 :常见的函数中this的绑定规则及代码验证

 // 函数的不同调用方式决定了this 的指向不同
  // 1. 普通函数 this 指向window
  function fn() {
    console.log("普通函数的this" + this);
  }
  window.fn();
  // 2. 对象的方法 this指向的是对象 o
  var o = {
    sayHi: function () {
      console.log("对象方法的this:" + this);
    },
  };
  o.sayHi();
  // 3. 构造函数 this 指向 ldh 这个实例对象 原型对象里面的this 指向的也是 ldh这个实例对象
  function Star() {}
  Star.prototype.sing = function () {};
  var ldh = new Star();
  // 4. 绑定事件函数 this 指向的是函数的调用者 btn这个按钮对象
  var btn = document.querySelector("button");
  btn.onclick = function () {
    console.log("绑定时间函数的this:" + this);
  };
  // 5. 定时器函数 this 指向的也是window
  window.setTimeout(function () {
    console.log("定时器的this:" + this);
  }, 1000);
  // 6. 立即执行函数 this还是指向window
  (function () {
    console.log("立即执行函数的this" + this);
  })();
  7 箭头函数this与最近一层有this指向的上级指向一致
  
  

const obj = {

sayThis: () => { console.log(this); } };

obj.sayThis(); // window 因为 JavaScript 没有块作用域,所以在定义 sayThis 的时候,里面的 this

就绑到 window 上去了

const globalSay = obj.sayThis;

globalSay(); // window 浏览器中的 global 对象