js中this的四种使用方法

0x00:js中this的四种调用模式

1,方法调用模式

2,函数调用模式

3,构造器调用模式

4,apply、call、bind调用模式

0x01:第一种：方法调用模式（也就是用.调用的）this就是这个对象本身

当一个函数被保存为对象的一个属性时，我们称它为一个方法，当一个方法被调用时，this被绑定到该对象，如果一个调用表达式包含一个属性表达式（即一个.点表达式或者[subscript]下标表达式）那么它被当做一个方法调用.


var myObject = {
    value:;
    increment:function(inc){
        this.value + = typeof inc === 'number'?inc:;
    }
}

myObject.increment();
document.writeln(myObject.value);//1
myObject.increment();
document.writen(myObject.value;)

方法可以使用this去访问对象,所以它能从对象中取得或修改该对象,this到对象的绑定发生在调用它的时候，这个超级“迟绑定”（very later binding）使用函数可以对this高度复用，通过this可取得它们所属对象的上下文的方法称为公共方法。

0x02:第二种：函数调用模式

当函数并非一个对象的属性时，那么它被当做一个函数来调用：

var sum = add(,);

当函数以些模式调用时，this被绑定到全局对象，这是语言设计上的一个错误，如果语言设计正确，当内部函数被调用时，this应该仍然绑定到外部函数的this对象，这个错误设计的后果就是方法不能利用内部函数来帮助它工作，因为内部函数的this被绑定了错误的值，所以不能共享该方法对对象的访问权，有一个很容易的解决办法如果该方法定义一个变量并给它赋值为this，那么内部函数就可以通过这个变量来访问到this


//给myObject增加一个double方法
myObject.double = function(){
    that = this; 
    var helper = function(){
        that.value = add(that.value,that.value);
    }
    helper();以函数的形式来调用helper
}
//以方法的形式来调用double
myObject.double();
document.wtiten(myObject.getValue());//6

0x03:第三种：构造函数调用模式


var Class = function(){
    this.value = ;
}

var class = new Class();
console.log(class.value); //100

我们通过new关键字来调用构造函数，此时this会绑定在该新对象上（也就是这个实例对象上）

0x04:第四种：apply和call以及bind的调用模式：指定绑定对象


var myObject = {value:};
var foo = function(){
    console.log(this);
};

foo(); //global
foo.apply(myObject);//{value:100}
foo.call(myObject);//{value:100}
var newFoo = foo.bind(myObject);
newFoo(); //{value:100}

apply()方法接受两个参数第一个是函数运行时的作用域，另一个是参数的数组(arguments)

call()方法第一个参数与apply是一样的，第二个参数需要一个个列举出来

call方法更接近我们平时调用函数，而apply需要我们传递 Array形式的数组做为参数,它们是可以相互转换的

秒客网

js中this的四种使用方法

相关文章