相信很多人开始学习js的时候,关于this的理解不是很清晰,并且一般靠直觉…然并卵,直觉这玩意儿不好说…在厌烦了直觉判断后的我,翻阅了很多…好吧,百度了好多文章,下面是我关于this的总结
(1)this的指向在函数定义的时候是确定不了的,只有在执行的时候才能确定this指向;
(2)this最终指向调用它的上一级对象;
(3)一般指向函数的拥有者,特殊的是自执行函数,this指向window
看个栗子就基本明确了
var number = 1;
var obj = {
number: 2,
shownum: function() {
console.log(this.number);
(function() {
console.log(this.number);
var obj = {
number: 3,
getNum: function() {
return this.number;
}
}
console.log(obj.getNum());
})();
}
}
obj.shownum(); //?
var fun = obj.shownum;
fun(); //?
构造函数的this:
function Engineer() {
this.skill = "program";
}
var fe = new Engineer();
console.log(fe.skill); //program 调用者是fe 所以this指向了fe
当this碰见return的时候
function Engineer() {
this.skill = "program";
return 1;
}
var fe = new Engineer();
console.log(fe.skill); //program
function Engineer() {
this.skill = "program";
return {
skill: 'smile'
}
}
var fe = new Engineer();
console.log(fe.skill); //smile
是的,构造函数返回一个对象,那么this就会指向返回的对象
function Engineer() {
this.skill = "program";
return null;
}
var fe = new Engineer();
console.log(fe.skill); //program
null比较特殊,尽管null也是对象,但这里的this还是会指向函数实例
补充:当this遇上闭包
JavaScript是基于词法(静态)作用域的语言,词法作用域的含义是指在函数定义时就确定了作用域,而不是执行时再确定;而this呢,是运行时的指向,而不是定义时的指向。栗子:
var a = 'win_a';
var scope = 'win_scope';
var obj = {
a: 'obj_a',
get: function() {
var that = this;
var scope = 'obj_scope';
return function() {
return that.a + '&' + scope;
}
}
}
alert(obj.get()()); // obj_a&obj_scope
var fun = obj.get;
alert(fun()()); // win_a&obj_scope
这个栗子感觉比较好
var x = 'windows';
var obj_a = {
x: 1,
y: {
x: 2,
y: function() {
return function() {
return this.x;
}
},
z: function() {
return this.x;
}
}
}
var fun = obj_a.y.y();
console.log(obj_a.y.z()); // 2
console.log(obj_a.y.y()()); // windows
console.log(fun()); // 'windows'