您的位置:首页 > Web前端 > JavaScript

js的一道经典题目

2017-09-01 18:33 239 查看
今天碰到一道题,里面既包含了匿名函数的知识,也包含了预编译,函数的传参(形参),感觉迷迷糊糊的,所以想着做个总结。

var foo={n:1};
(function(foo){
console.log(foo.n);
foo.n=3;
var foo={n:2};
console.log(foo.n);
})(foo);
console.log(foo.n);


上面的代码,可以写成这样,看解释

1 var foo={n:1};
2      (function(foo){        //此时形参和实参指向相同的内存空间,且空间的值n为1
3        var foo;             //变量的提升,一个变量的声明优先级低于形参,so这行相当于无效
4        console.log(foo.n);  //这里应当输出1
5        foo.n=3;             //形参和实参的指向的内存空间发生了改变,值现在变为3
6        var foo={n:2};       //这行很关键,开辟了新的内存空间,n的值为2
7        console.log(foo.n);  //由于js中的代码是自上而下执行,所以此时输出2
8      })(foo);
9      console.log(foo.n);    //之前的内存空间值为3,所以输出3
结果输出  1  2  3


按照上面的思路,如果第五行和第六行换一下呢

1 var foo={n:1};
2      (function(foo){        //此时形参和实参指向相同的内存空间,且空间的值n为1
3        var foo;             //变量的提升,一个变量的声明优先级低于形参,so这行相当于无效
4        console.log(foo.n);  //这里应当输出1
5        var foo={n:2};      //这行很关键,开辟了新的内存空间和之前的已经断开联系,n的值为2
6        foo.n=3;             //改变了新的内存空间里面的值,值现在变为3
7        console.log(foo.n);  //由于js中的代码是自上而下执行,所以此时输出3
8      })(foo);
9      console.log(foo.n);    //之前的内存空间值为1,所以输出1
结果输出 1  3  1


ok   那接下来这个呢

1  var foo={n:1};
2      (function(foo){        //此时形参和实参指向相同的内存空间,且空间的值n为1
3        var foo;             //变量的提升,一个变量的声明优先级低于形参,so这行相当于无效
4        console.log(foo.n);  //这里应当输出1
5        foo.n=3;             //形参和实参的指向的内存空间发生了改变,值现在变为3
6        foo.n=2              //并没有开辟了新的内存空间,在原来的基础上修改的,n的值为2
7        console.log(foo.n);  //由于js中的代码是自上而下执行,所以此时输出2
8      })(foo);
9      console.log(foo.n);    //原始的的内存空间值经过修改变为2,所以输出2
结果输出  1  2  2


下面和上面一样了

1 var foo={n:1};
2      (function(foo){        //此时形参和实参指向相同的内存空间,且空间的值n为1
3        var foo;             //变量的提升,一个变量的声明优先级低于形参,so这行相当于无效
4        console.log(foo.n);  //这里应当输出1
5        foo.n=2;             //形参和实参的指向的内存空间发生了改变,值现在变为2
6        foo.n=3;              //并没有开辟了新的内存空间,在原来的基础上修改的,n的值为3
7        console.log(foo.n);  //由于js中的代码是自上而下执行,所以此时输出3
8      })(foo);
9      console.log(foo.n);    //原始的内存空间的值经过修改变为3,所以输出3
结果输出 1  3  3


那下面这个呢(第五行和第六行都改变了指向,由于并不是在原来的基础上修改的,所以最后输入的值不变)

1    var foo={n:1};
2      (function(foo){        //此时形参和实参指向相同的内存空间,且空间的值n为1
3        var foo;             //变量的提升,一个变量的声明优先级低于形参,so这行相当于无效
4        console.log(foo.n);  //这里应当输出1
5        var foo={n:2};             //开辟了新的内存空间,n的值为2
6        var foo={n:3};          //开辟了新的内存空间,n的值为3
7        console.log(foo.n);  //由于js中的代码是自上而下执行,所以此时输出3
8      })(foo);
9      console.log(foo.n);    //原始的内存空间的值为1,并没被有被修改,所以输出1
结果输出 1  3   1


这个就和上面的一样了

1    var foo={n:1};
2      (function(foo){        //此时形参和实参指向相同的内存空间,且空间的值n为1
3        var foo;             //变量的提升,一个变量的声明优先级低于形参,so这行相当于无效
4        console.log(foo.n);  //这里应当输出1
5        var foo={n:3};            //开辟了新的内存空间,n的值为3
6        var foo={n:2};          //开辟了新的内存空间,n的值为2
7        console.log(foo.n);  //由于js中的代码是自上而下执行,所以此时输出2
8      })(foo);
9      console.log(foo.n);    //原始的内存空间并未被修改,所以输出1
结果输出 1  2  1


以上为小弟解读,如果过错还请大神指教。

 
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: