面试题解析 this 指向:
上几道面试题 来分析一下this的指向
个人总结了一句话 this指向规则 运行一个函数 没有调用者 指向全局window
有调用者 指向调用者 但是在箭头函数中 谁定义 就指向谁
1题
分析
obj.f() 他的调用者是obj, obj作用域内部的name 的值修改了全局name 的值 就是xyz
obj.f2() 箭头函数 obj属于window下 可以看成window.obj.f2() 遵循谁定义 指向谁 window下定义 那么指向全局 window的name 随意结果是abc
obj.f3() 虽然里面也是箭头函数 但是他和obj.f()是一样的 结果就是 xyz
2题
分析 (function() { console.log(this.number) }) 遵顼谁调用 指向谁 这个没有调用者 指向windw 结果 1
console.log(this.number) 指向域内 this.number = 3 结果是 3
3题
var length = 88;
function text() {
console.log(this.length);
}
var obj = {
length: 99,
action:function(test) {
test();
arguments[0]();
}
}
obj.action(test,[1,2,3,4,5]);
分析 obj.action中 text作为参数,并没有调用者 那么this.length指向全局window 所以 test() 输出结果 88
arguments 表示参数集合 obj.action有两个参数 arguments[0] 对应text方法 遵循 谁调用 指向谁的原则
this 指向数组 this.length 是数组的长度 2
这道题的结果 就是 88 和 2
4题
var a = 10;
function test() {
console.log(a);
a = 100;
console.log(this.a);
var a;
console.log(a)
}
test();
分析
第一个a 指向test方法内部 没有定义a 那么就是undefined
第二个 this.a 指向window 但是test方法内的a值改变了全局a 结果是100
第三个 a 指向test内部的a 值是100
这题结果 就是 undefined 100 100
再来两个个相似的题
var a = 10;
function test() {
a=100
console.log(this.a);
}
test()
分析 this.a 指向 全局window 的a 但是域内a的值改变了 所以最后结果 100
var a = 10;
function test() {
var a=100
console.log(this.a); // this.a 指向 window
}
test()
分析
当全局变量和局部变量同名 全局变量不会作用于局部变量的作用域
按照此题 就是说 a=10 不会作用到 test方法里面 那么this.a 指向 全局window 结果就是 10