PostsOldAbout

javascript之块级作用域

· javascript, 前端技术

javascript是没有块级作用域的

在函数中声明的变量在任意位置都是有效的

EG:

<strong>var name='kang';</strong>
<strong>function AlterName(){</strong>
<strong>&nbsp; &nbsp; alert(name); &nbsp;//undefined</strong>
<strong>&nbsp; &nbsp; var name="wen";<span style="color:#000000;"></span></strong>
<strong>&nbsp; &nbsp; alert(name); //wen</strong>
<strong>}</strong>
<strong>AlterName();</strong>
以上代码可以很好的看出这种特性
在当前局部作用域实际上是有声明变量name的而第一个alter在变量name声明赋值
所以alter未定义 &nbsp;而第二个alter就更好理解了
<br />

再看一段代码

<strong>eg:</strong>
<br />
<strong>function AlterValue(){</strong>
<strong>&nbsp; &nbsp; for(var i=0;i&lt;10;i++){</strong>
<strong>&nbsp; &nbsp; &nbsp; &nbsp; console.log(i);//i</strong>
<strong>&nbsp;&nbsp;&nbsp;&nbsp;}</strong>
<strong>&nbsp; &nbsp; alert(i);//10</strong>
<strong>}</strong>
<strong>AlterValue();</strong>
上面这段代码
在控制台输出了0-9
而弹窗并不是别的语言似的弹出未定义
而是弹出10

块语句中定义的变量实际上是在包含函数中而非在语句中创建的!

函数中声明的所有变量,无论是在哪里声明的,在整个函数中它们都是有定义的

<br />

我们可以通过创建一个闭包来模仿这种块级作用域的效果

<br />
<strong>function AlterValue(){</strong>
<strong>&nbsp;&nbsp;&nbsp;&nbsp;(function(){</strong>
<strong>&nbsp; &nbsp; &nbsp;&nbsp;&nbsp;&nbsp;for(var i=0;i&lt;10;i++){</strong>
<strong>&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; console.log(i);//i</strong>
<strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}})();</strong>
<strong>&nbsp; &nbsp; alert(i);//报错</strong>
<strong>}</strong>
<strong>AlterValue();</strong>
<br />
分析一下原理
实际上做了什么?
创建了一个闭包 此时这个匿名函数是可以调用函数内部的变量的
但是匿名函数外部 却无法调用这个匿名函数内部的变量
所以此时再alter(i)就会报错
<br />
在javascript 调用变量之后如果新手容易模糊应该在调用结束之后手动给一下var xx;或者var xxx=null;
手动清理一下当然这只是一个<strong><span style="background-color:#FFFFFF;color:#E53333;">建议</span></strong>
<br />
<strong><span style="background-color:#FFFFFF;color:#E53333;"><span style="background-color:#FFFFFF;"><span style="color:#FFFFFF;"></span></span><br />

这种私有作用域的方法  常用于避免命名冲突和影响全局作用域

That's all

<br />

2026 © zwkang.RSS