环境记录初始化对函数变量的影响-对前端微专业群内一道难题的解析

事情原委:

我在做前端微专业JavaScript进阶篇的测验,然后遇到这么一题。

<span style="font-size:14px;">以下代码执行时两个alert分别输出值是
(function(){
a = 5;
alert(window.a);
var a = 10;
alert(a);
})();
</span>


我一开始判断是选择A,因为我知道在函数中,如果对一个变量直接赋值,而没有声明的话,JS会创建一个全局变量,也就是挂靠在window底下。

比如:

<span style="font-size:14px;">test(); 
function test(){a=10;}; 
console.log(a);    //结果是输出10;</span>

可见,我所知道的这条原则确实是存在的。


然而,当我把题目这几行代码输入到console中去测试的时候,结果是"undefined, 10".

这个我就非常不理解了,我一度以为是浏览器的错误。

直到群里的大神指点后,我把代码改成这样:

<span style="font-size:14px;">(function(){
a = 5;
alert(window.a); 
// var a = 10;
alert(a);
})();
</span>

马上,直接结果就变成了5,也就是说我之前深信不疑的原则起作用了。

也就是说,底下这个var a = 10; 改变了结果,使得第一个alert无法取到window.a的值,或者说,使得window.a这个变量根本就不存在。


估计看到这里,聪明的人已经知道答案了,没错,原因就是JS中环境记录初始化的规则:

环境记录初始化:也就是常说的声明提前。在全局代码或者函数代码执行前,JS都会为其进行环境初始化。函数形参->函数声明(function x())->函数中变量声明(var y )(按照我写的顺序)都会在常规执行前就先做了。

所以说,

<span style="font-size:14px;">(function(){
a = 5;
alert(window.a);
var a = 10;
alert(a);
})();</span>

的真实执行顺序是:

(1)环境初始化:

var a;    //a已经被声明在函数内;

(2)常规执行阶段:

a = 5;   //a被第一次赋值;

alert(window.a)   // 由于a已经被声明在函数内,因此window下并没有a这个变量,因此弹出undefined;

a = 10;    //a被第二次赋值;

alert (a);   // 弹出10;


现在你明白了嘛?


感谢:大葱,Link等一众群友的指点!



评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值