一道关于this指向的前端面试题

Question

前端笔试中遇到这么一道考this指向的题，求解答为什么x.x 调用结果会是undefined？

相关Code

    function a(xx) {
        this.x = xx;
        return this;
    }

    var x = a(5);
    var y = a(6);

    console.log(x.x);    //undefined
    console.log(y.x);    //6

Answer 1

谁调用该函数，里面的this指向谁，a()是放在全局环境中调用的，this指向的window

一： var x = a(5);

执行过程：
函数内部相当于执行window.x = 5，然后返回window对象。
var x = window 就相当于window.x = window;

二： var y = a(b);

执行过程：
函数内部相当于执行window.x = 6，然后返回window对象。
var y = window。（执行完后window.x = 6了而不是原来的window.x = window了）

三：console.log(x.x) 就相当于 window.x.x 目前window.x是等于6的，6是没有x属性的，所以打出undefined.
console.log(y.x) 就相当于window.x = 6

Answer 2

var y = a(6)
执行这条语句的时候，已经将6这个number付给前面的x变量了，这样在执行console.log(x.x)，当然是undefined

Answer 3

@helloworld_ 童鞋已经回答的很好了，我这里就不解析了。

我这里补充一下吧，其实这种问题在控制台打个断点调试下就行了，直接看确实坑很多。

Answer 4

1.在全局环境中使用var x，相当于给window添加x属性
2.执行var x = a(5)，在function中给x赋值为5，但是将this返回给它本身，则导致它又等于window，此时x === x.x === x.x.x === ... === window，按照理论来说只要你能输出所有的x.x，那应该能有机会看到5，但这本身是一个无限循环
3.至于y为何没有undefined，原因是它没有和x变量同名