JavaScript中的this
两个例子:
var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
return function(){
return this.name;
};
}
};
console.log(object.getNameFunc());//function(){return this.name;}
console.log(object.getNameFunc()());//The Window。上行的函数作为单纯函数调用时(单纯执行return this.name),this指向全局对象(严格模式时,为undefined)
var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
var that = this;
return function(){
return that.name;
};
}
};
console.log(object.getNameFunc());//function(){return that.name;}
console.log(object.getNameFunc()());//My Object。函数作为对象的方法调用时(调用that),this指向该对象。
总结:
var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
console.log(this==object); //true
return function(){
console.log(this); //Window
return name; //"The Window"
};
}
};
console.log(object.getNameFunc()());//"The Window"
结合闭包
var myObject=(function(){
console.log(this); //Window
var _name='sven'; //私有变量
var pp='55';
return{ //公开方法
pp:'66',
getName:function(){
console.log(this==myObject); //true
return _name;
}
}
})();
console.log(myObject);//{pp:'66',getName:function(){return _name;}
//单纯地提取出myObject里面的值:
console.log(myObject.pp);//66
console.log(myObject.getName);//function (){return _name;}
console.log(myObject._name);//undefined 不存在的
//执行return _name
console.log(myObject.getName());//sven 通过return读取私有变量
如果在公开方法里添加_name
var myObject=(function(){
console.log(this);//Window
var _name='sven'; //私有变量
var pp='55'; //私有变量
return{ //公开方法
pp:'66',
_name:'jack',
getName:function(){
console.log(this==myObject); //true
return _name;
}
}
})();
console.log(myObject);//{pp:'66',_name:'jack',getName:function(){return _name;}
//单纯地提取出myObject里面的值:
console.log(myObject.pp);//66
console.log(myObject.getName);//function (){return _name;}
console.log(myObject._name);//jack
//结论:总是会单纯地返回 return得到的myObject里面的属性
//执行return _name
console.log(myObject.getName());//sven
//如果第一行的私有变量_name未赋值,这里也会变成undefined,所以return _name总是返回私有变量的_name,与其他地方(return里面)的_name无关
如果使用this
var myObject=(function(){
console.log(this);//Window
var _name='sven'; //私有变量
var pp='55'; //私有变量
return{ //公开方法
pp:'66',
_name:'jack',
getName:function(){
console.log(this==myObject);//true
return this._name;
}
}
})();
//只是function里加多了this,其他与上面的结论没什么变化
console.log(myObject);//{pp:'66',_name:'jack',getName:function(){return this._name;}
console.log(myObject.pp);//66
console.log(myObject.getName);//function (){return this._name;}
console.log(myObject._name);//jack
//执行return _name
console.log(myObject.getName());//jack this指向return回来的那个object,其实也就是myObject,只不过私有变量全部隐藏,只有return到的值(object)
//同样地,如果里面的_name:'jack'不存在(未定义),结果就会是undefined
//结论:绑定this后,myObject.getName()等价于myObject._name
this的使用
情况一:纯粹的函数调用
var x = 1;
function test(){
this.x = 0;
}
test(); //window调用test函数,所以this指的就是window
console.log(x); //0
情况二:作为对象方法的调用
function test(){
console.log(this.x);
}
var myObject = {
x:1,
y:test
};
myObject.y(); // 1
情况三:apply调用
var x=0;
function test(){
console.log(this.x);
}
var myObject = {
x:1,
y:test
};
myObject.y.apply();//0
//apply()的参数为空时,默认调用全局对象
myObject.y.apply(myObject); //1
情况四:作为构造函数调用
function test(){
this.x = 1;
}
var myExample = new test();
console.log(myExample.x); // 1