前端攻城狮

JS中this指向

2019-07-22  本文已影响5人  LemonnYan

函数有4种调用方式,对应就有4种绑定规则:默认绑定、隐式绑定、硬绑定和构造函数绑定。

1、默认绑定

当作为普通函数被调用时,就会发生默认绑定,this指向全局对象。在严格模式中,this的值会变为undefined。

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

function func2(){
  "use strict";
  console.log(this);  //undefined
}
func2();

2、隐式绑定

当作为对象方法被调用时,就会发生隐式绑定,this指向调用该方法的对象。

var obj={
  name:"lemon",
  getName:function(){
    console.log(this.name);  //lemon
  }
}
obj.getName();

3、硬绑定

当调用函数的方法apply()、call()或bind()时,就能指定this要绑定的对象。如果传入null或undefined,会被替换为全局对象(window);如果传入其它原始值(数字、字符串或布尔值),会被自动转化为对应的包装对象(Number、String或Boolean)。

var obj={
  name:"lemon",
  getName:function(){
   return this.name;
  },
  getThis:function(){
   return this;
  }
};

var name="freedom";
obj.getName.apply(null);  //"freedom"
obj.getName.apply(undefined);  //"freedom"
obj.getName.apply(true);   //new Boolean(true);

4、构造函数绑定

当用new运算符调用构造函数时,会创建一个新对象,构造函数中的this会与这个新对象绑定在一起。

var name="freedom";
function func(){
  this.name="lemon";
  this.getName=function(){
   return this.name;
  };
};

var obj=new func();
obj.getName();   //"lemon"
上一篇 下一篇

猜你喜欢

热点阅读