javascript面向对象题目

Question

 window.a=300;

    function fn1(){

      this.a=100;

      this.b=200;

      return function(){

        alert(this.a);

      }.call(arguments[0]);

    }

    function fn2(){

      this.a=new fn1();

    }

    var a=new fn1().b;//300

        //{a:100,b:200}.b

    //a=200

    var v=new fn1(fn2());

          //200 [object Object]

    //fn2(): a={a:100,b:200}

    //v:{a:100,b:200}

双斜扛后面是输出结果 

为什么是这样啊？js引擎到底怎么走的？

Answer 1

首先，this是在创建的时候调用    先看new fn1()，就是对fn1创建了个实例，指向fn1.prototype，因此this.a=100，this.b=200中的this就是fn1.prototype，也就是fn1，因此new fn1().a=100; new fn1().b=200;    接下来是return function(){}；这么写相当于将函数返回出去，相当于在全局作用域中创建一个function，当进行到return function这一步，这个函数里面的this已经是window了，不再是fn1；而.call(arguments[0])的意思是如果存在第一个参数，则将这个return的函数中的this绑定为第一个参数；现在开始， 第一步，执行var a=new fn1().b，(第一个实例)alert(this.a)是属于return function中的，是在创建实例的过程中执行，而var a=new fn1().b;是实例创建好后，再去查找b的值，所以先执行alert(this.a);因为没有赋予参数，所以return function中的this就是window，因此alert(this.a)弹出300；new fn1().b为200，所以经过var a=new fn1().b后， window.a=200;  new fn1()={a:100,b:200}第二步，执行new fn1(fn2())，参数是fn2()，因此call()方法将fn1()里面return的函数中的this绑定为fn2();因此创建实例(第二个实例)中的alert(this.a)，就是alert(fn2().a)，也就是alert(new fn1()),再次创建fn1实例(第三个实例)，因为window.a是200，因此创建实例中(第三个实例)的alert(this.a)弹出为200（步骤与第一步一样）；第三个实例创建完毕，继续执行第二个实例中alert(new fn1())中的这个alert；new fn1()就是{a:100,b:200}，因此弹出[object Object]，其实内部就是{a:100,b:200},可用console.log查看；弹完2个alert，实例(第二个实例)创建完成，window.a=200; new fn1()={a:100,b:200} v={a:100,b:200}