首页 > 除了第一题的值是20好理解,剩下的不好理解?

除了第一题的值是20好理解,剩下的不好理解?

var x = 10;
var foo = {
    x: 20,
    bar: function () {
        var x = 30;
        return this.x;
    }
};
console.log(
    foo.bar(),                 //    20.
    (foo.bar)(),               //    20.
    (foo.bar = foo.bar)(),     //    10.
    (foo.bar, foo.bar)()       //    10.
);

在 bar 中 console.log(this), 查看this 指向的是哪


这题考的主要知识点是同名变量覆盖和上下文this的问题。

(foo.bar)()这个是取得表达式foo.bar的值,然后执行它,和foo.bar()是一样的。

(foo.bar = foo.bar)()这个就有意思了,它是把foo.bar赋给foo.bar,感觉好像啥都没做是不是?但就是因为这个赋值语句,让bar方法脱离了它原本的上下文foo,变成了一个全局函数。因为JS中赋值语句是有副作用的,除了赋值,还会把这个值返回。
实际上这句代码相当于:

var temp = (foo.bar = foo.bar);
temp();

这时候的temp指向foo.bar,但此时的this却不再是foo,而是全局对象(window)。因为全局变量相当于window的属性,所以返回的是全局变量x的值10

(foo.bar, foo.bar)()这个同理,逗号运算符会依次执行每个子表达式,并返回最右的那个子表达式的值。

【热门文章】
【热门文章】