1.方法调用模式
当一个函数被保存为对象的一个属性时,我们称之为一个方法。当一个方法被调用时,this被绑定到该对象。
[javascript] view plain copy
function A() {
this.x = 1; //定义a.x
this.b = function () { //定义a.b
this.helper = function () { //定义a.helper
console.log(this); //4.console.log(a)
}
this.helper(); //3.调用a.helper(); 此时的helper,是一个方法,所以helper中的this指向a
}
this.b(); //2.调用a.b(),此时的b是a的一个属性,所以是一个方法,所以b中的this指向a
}
var a = new A(); //1.创建a对象
输出: A {x:1}
2.函数调用模式
当一个函数不是一个对象的属性时,就是被当做一个函数来调用的。此时this被绑定到全局对象。
[javascript] view plain copy
function A() {
this.x = 1;
this.b = function () {
var helper = function () {
console.log(this);
}
helper(); //此时的helper不是任何对象的属性,只是一个函数
}
this.b();
}
var a = new A();
输出: Window {external: Object, ......}
3.构造器调用模式
用new关键字,此时this被绑定到创建出来的新对象上。
[javascript] view plain copy
function A() {
this.x = 1;
this.b = function () {
this.helper = function () { //定义aa.helper
console.log(this); //4.console.log(aa)
}
this.helper(); //3.调用aa.helper(); 此时的helper,是一个方法,所以helper中的this指向aa
}
var aa = new this.b(); //2.创建一个新的对象aa,所以b()中的this指向aa
}
var a = new A(); //1.创建a对象
输出: A.b {} ;
另外,这里举Splunk吉祥物pony的例子来说一说new操作符做的事情:
[javascript] view plain copy
function Pony(color) {
// var this = Object.create(Pony.prototype);
// instance members
this.color = color;
// private members
var age = 50;
// private methods
function secreteMethod() {
console.log('Secret!');
}
// make private member visible due to closure
this.getAge = function() {
console.log('My age is : ' + age);
};
// return this;
}
// methods
Pony.prototype.tellColor = function() {
console.log('I am ' + this.color);
};
// static attributes
Pony.type = 'horse';
var pony = new Pony('white');
pony.tellColor();
pony.getAge();
what happens?
[javascript] view plain copy
var pony = new Pony('white');
// equals
var pony = {};
pony.__proto__ = Pony.prototype;
Pony.call(pony, 'white');
4.apply调用模式
js是一门函数式的面向对象编程语言,所以函数可以有方法。apply(or call)方法允许我们构建一个参数数组传递给调用函数,也允许我们选择this的值。它接受两个参数,第一个是要绑定给this的值,第二个是一个参数数组。
[javascript] view plain copy
function People (name) {
this.name = name;
}
People.prototype.greet = function () {
console.log('hi,'+this.name);
};
var dog = {
name: 'hobbo'
};
People.prototype.greet.apply(dog);
输出: hi,hobbo
总结:
this默认指向global object
当函数作为对象的属性被调用时,函数中的this指向那个对象
当使用new操作符来调用函数时,函数中的this指向新创建的对象
当使用apply或者call来调用函数时,this指向被传给call活apply的第一个参数。如果第一个参数是空或者不是一个对象,this指向global object