• 技术文章 >web前端 >前端问答

    javascript的块级作用域有什么用

    青灯夜游青灯夜游2022-01-18 12:03:42原创276

    块级作用域的作用:解决由于过多全局变量和函数产生的命名冲突。JavaScript会对重复的声明视而不见,从而导致运行结果出错,而块级作用域就可以解决这个问题,让每个开发人员可以使用自己的变量,而不用担心搞乱全局作用域。

    本教程操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。

    什么是块级作用域?

    任何一对花括号({和})中的语句集都属于一个块,在这之中定义的所有变量在代码块外都是不可见的,我们称之为块级作用域,例如for、while、if

    而JavaScript不具有块级作用域(在es6标准出来之前,javascript是不存在块级作用域的),即在javascript的代码块中定义一个变量,在该代码块外面仍可使用该变量,例如:

    <script type="text/javascript">  
       var i=1;  
         if(i==1){  
            var b=2;  
         }  
       alert(b);//输出2  
    
       function outputNumbers(count){
           for(vari=0;i<count;i++){
               alert(i);
           }
               alert(i); //计数
        } 
    </script>

    在Java、C++等语言中,变量i只会在for循环的语句块中有定义,循环一旦结束,变量i就会被销毁。但是在JavaScript中,变量i是定义在outputNumbers()的活动对象中的,因此从它有定义开始,就可以在函数内部随处访问它。

    为什么要在JavaScript中实现块级作用域,它有什么用?

    块级作用域可以解决由于过多全局变量和函数产生的命名冲突,因为JavaScript会对重复的声明视而不见(不过,它会执行后续声明中的变量初始化),从而导致运行结果出错,而你很可能要花很大的力气才能发现这个错误。

    在由一个很多开发人员编写的大型应用程序中,私有作用域的应用可以使得每个开发人员可以使用自己的变量,而不用担心搞乱全局作用域。

    JavaScript如何实现块级作用域

    虽然js中没有块级作用域,但是可以用闭包/匿名函数来模仿块级作用域。

    块级作用域(通常称为私有作用域)的匿名函数的语法如下:

    (function(){
    
      //这里是块级作用域
    
    })();

    以上代码定义并立即调用了一个匿名函数。将函数声明包含在一对圆括号中,表示它实际上是一个函数表达式。而紧随其后的另一对圆括号会立即调用这个函数。

    一个在JavaScript中利用匿名函数实现块级作用域的例子

    function outputNumbers(count){
       (function(){
          for(var i=0;i<count;i++){
              alert(i);
             }
            })();
        alert(i); //导致错误!
       }

    例子中,在匿名函数中定义的任何变量,都会在执行结束时被销毁。因此,变量i只能在循环中使用,使用后即被销毁。而在私有作用域中能够访问变量count,是因为这个匿名函数是一个闭包,它能够访问包含作用域中的所有变量。

    什么时候可以使用私有作用域

    无论在什么地方,只要临时需要一些变量,就可以使用私有作用域

    【相关推荐:javascript学习教程

    以上就是javascript的块级作用域有什么用的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    上一篇:html中next是什么意思 下一篇:javascript继承有什么用
    千万级数据并发解决方案

    相关文章推荐

    • JavaScript中end是什么意思• javascript中class的意思是什么• javascript怎样修改字符串的某个值• javascript怎样只获取日期• javascript怎样设置文本框不能输入数字• JavaScript学习总结之原型对象(整理分享)
    1/1

    PHP中文网