js中this的指向

一、全局函数
指向window对象

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

二、构造函数
指向实例对象

function Person(name, age) {
      console.log(this);//指向zs/ls
      this.name = name;
      this.age = age;
    }
    var zs = new Person('zhangsan', 18);
    var ls = new Person('lisi', 20);

三、对象的方法
指向对象

var obj = {
      fn: function () {
        console.log(this);
        console.log(this === obj) //true
      }
    }
    obj.fn();

四、事件处理函数
指向事件源对象

 var btn = document.querySelector('#btn');
    btn.onclick = function () {
      console.log(this); //指向btn
    }
var btn = document.querySelector('#btn');
    btn.addEventListener('click', function () {
      console.log(this); //指向btn
    })

五、定时器回调函数
指向window对象

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

六、箭头函数
箭头函数中不绑定this,箭头函数中的this指向它所定义的位置,可以理解为,定义箭头函数中的作用域的this指向谁,它就指向谁

setTimeout(() => {
      console.log(this);//window
    }, 1000)
 const obj = {
      name: 'zhangsan'
    }
    function fn() {
      console.log(this); //obj
      return () => {
        console.log(this) //obj
      }
    }
    const resFn = fn.call(obj);
    resFn();

你可能感兴趣的:(js)