题目描述:写出打印结果,并解释为什么
var a = 10;
var foo={
a:20,
bar:function(){
var a=30;
return this.a;
}
}
console.log(foo.bar());
console.log((foo.bar)());
console.log((foo.bar=foo.bar)());
console.log((foo.bar,foo.bar)());
答案:
20
20
10
10
解析:
第一问: foo.bar()
- foo 调用,this 指向foo,此时的 this 指向的是 foo,输出 20
第二问:(foo.bar)()
- 给表达式加了括号,而括号的作用是改变表达式的运算顺序,而在这里加与不加括号并无影响;相当于 foo.bar(),输出 20
第三问:(foo.bar = foo.bar)()
- 等号运算,相当于给 foo.bar 定义,即:
foo.bar = function(){
var a = 10;
return this.a;
}
- 就是普通的复制,一个匿名函数赋值给一个全局变量,所以这个时候 foo.bar 是在 window 作用于下而不是 foo = {} 这一会计作用域,所以这里的 this 指代的是 window ,输出 10
第四问:(foo.bar,foo.bar)()
- 1.逗号运算符
- 2.逗号表达式,求解过程是:先计算表达式 1 的值,在计算表达式 2 的值,.......一直计算到表达式 n 的值。都好运算符的返回值是最后一个表达式的值
- 3.其实这里主要还是经过逗号运算符后,就是存粹的函数了,不是对象方法的引用,所以这里 this 指向的是 window,输出 10
- 4.第三问,第四问,一个是等号运算符,一个是逗号运算符,可以这么理解,经过赋值,运算符运算后,都是存粹的函数,不是对象方法的引用。所以函数指向的 this 都是 window 的
知识点:
this 绑定的四条规则
1.默认绑定
独立函数调用时,this 指向全局对象(window),如果使用严格模式,那么全局对象是无法使用默认绑定,this 绑定至 undefined
2.隐式绑定
函数 this 是指向调用者(隐式指向)
function foo(){
console.log(this.a);
}
var obj = {
a:2,
foo:foo
}
obj.foo();//2
obj.obj2.foo()//foo 中的 this 与 obj2 绑定
问题:隐式丢失
描述:隐式丢失值得是函数中的 this 丢失绑定对象,即他会应用第 1 条的默认绑定规则,从而将 this 绑定到全局对象上或者 undefined 上,取决于是否在严格模式下运行
以下情况会发生隐式丢失:
- 1.绑定至上下任对象的函数被赋值给一个新的函数,然后调用这个新的函数时
- 2.传入回调函数时
3.显式绑定
显式绑定的核心是 JavaScript 内置的 call() 和 apply() 方法,call 和 apply bind 的 this 第一个参数(显式指向)
4.new 绑定
构造函数的 this 是 new 之后的新对象即实例对象(构造器)