cari

Rumah  >  Soal Jawab  >  teks badan

javascript - 这是一道js的笔试题 里面的this有点模糊，能给我说说原因吗

<!DOCTYPE html >
<html >
<head>
<title> new document </title>

<meta charset="utf-8" />
</head>

<body>
<script>

var number=2;
var obj={
   number:4,
   /*匿名函数自调*/
   fn1:(function(){
           var number;
           this.number*=2;//4

           number=number*2;//NaN
           number=3;
           return function(){
                 var num=this.number;
                 this.number*=2;//6
                 console.log(num);
                 number*=3;//9
                 alert(number);
           }
    })(),

    db2:function(){
        this.number*=2;
    }
}

var fn1=obj.fn1;

alert(number);//4....

fn1();//9

obj.fn1();//27

alert(window.number);//8....

alert(obj.number);//8

</script>
</body>
</html>

巴扎黑巴扎黑2895 hari yang lalu235

membalas semua(2)saya akan balas

  • PHPz

    PHPz2017-04-10 17:14:37

    还是给你逐一解释吧。

    var number=2;
var obj={
   number:4,
   fn1:(function(){ // 匿名函数1
           var number;
           this.number*=2;// (1)
           number=number*2;// (2)
           number=3;
           return function(){ // 匿名函数(2)
                 var num=this.number;
                 this.number*=2;
                 console.log(num);
                 number*=3;
                 alert(number);
           }
    })(),
    db2:function(){
        this.number*=2;
    }
}
var fn1=obj.fn1; // (3)
alert(number);// (4)
fn1();// (5)
obj.fn1();// (6)
alert(window.number);
alert(obj.number);

    • 当定义obj的时候执行了匿名函数1，此时处于全局作用域内，因此上下文this是window。执行完语句(1)导致全局变量number的值变为4；执行语句(2)时临时变量number还没有被赋值，所以是NaN，但下一句会将其赋值为3；最后，匿名函数1返回了匿名函数2，因此obj.fn1=匿名函数2。（注意匿名函数2里面会用到临时变量number，老生常谈的闭包）

    • 来到语句(3)，这句会把fn1这个变量赋值为obj.fn1，也就是匿名函数2

    • 由于全局变量number已经在语句(1)中变为了4，所以语句(4)弹出的对话框结果为4

    • 语句(5)执行的是fn1()，它与执行obj.fn1()的区别是两者this不一样。前者为null，而后者this为obj。但是又由于JS规定，this为null时相当于全局对象window，所以这句代码执行时函数的this为window。在匿名函数2里会将全局变量number更新为8，同时将匿名函数1中被闭包的临时变量number更新为9

    • 语句(6)的效果在上面已经分析过了，this是obj，所以obj.number更新为8，闭包的number更新为27

    balas
    0
  • 黄舟

    黄舟2017-04-10 17:14:37

    //obj里面的那些值可以理解吧
var fn1=obj.fn1; //到这句的时候，你把它理解成 fn1跟obj.fn1指向通过地址，然后那个地址里面的内容，也就是下面这段
/*
(function(){
           var number;
           //this.number*=2;//4

           //number=number*2;//NaN
           number=3;
           return function(){
                 var num=this.number;
                 this.number*=2;//6
                 console.log(num);
                 number*=3;//9
                 alert(number);
           }
    })()
*/
这时候的执行环境是在window下面，因此这时候的this指向的是window，所以this.number 是2，上面那段代码的return  function 里面 this.number*=2 //4  改变了外面的number值，所以alert(number);//4....


/*
至于  fn1();//9
fn1执行的是返回的函数
return function(){
     var num=this.number;
     this.number*=2;//6
     console.log(num);
     number*=3;//9
     alert(number);
   }
这里由于作用域的原因，找到的是它外面那个函数定义的 number=3；所以输出了9，还就就是这里的this指向的是window，因此this.number  又*2=8（alert(window.number);//8....）；
*/


/*
obj.fn1();//27  这里在执行obj.fn1()的时候，this指向的是obj，上面obj的number 已经是  9了，这回又*3=27
*/

    balas
    0
  • Batalbalas