zoukankan      html  css  js  c++  java
  • JS变量的提升详解

    此次说明的是var与function的变量提升

        那么先看一段代码

     1 <script type="text/javascript">
     2 
     3   console.log(test);
     4   var test = function(){
     5   console.log(1);
     6   }
     7   function test(){
     8   console.log(2);
     9   }
    10   console.log(test);
    11 
    12 </script>

      执行如上代码会产生什么结果呢?

      正确结果是输出

      ƒ test(){
      console.log(2);
      }

      ƒ (){
      console.log(1);
      }

      为什么不是 1   2 ?  或者  2   1?

      这里需要说一个和变量提升无关的(敲黑板!!!)

      console.log(text)是在控制台输出的text是一个函数体

      因为执行函数是  text()  而输出 text 则是输出text这个函数体,它并没有执行。

    -------------------------------------------------------------华丽的分割线--------------------------------------------------------------------------

      好了,那么我们来看一下函数的具体执行顺序。

      我们都知道var与function会进行一个变量的提升,但是当var与function冲突的时候他们提升的一个优先顺序又是怎么样的呢?

     1 <script type="text/javascript">
     2 
     3     var test;           //实验证明当var和function冲突时计算机会先解析function,由此我们可以假设在冲突时,
                      var会先进行一个提升(也就是排在最上面) 但只提升了var声明的变量,var test具体的内容还在下面(第11行)等待赋值。
    4 5 function test(){ //function会排在var的下面,这样解析时可以理解为下面的function覆盖了之前的var。 6 console.log(2); 7 } 8 9 console.log(test); //此时解析到的test就是函数体——function(){console.log(2);} 因为之前的var被覆盖了。
    10 11 test = function(){ //这里再次对test进行一个赋值,又覆盖掉了上面的(第5行)function。(此时之前声明的var test终于等到了他想要的人...) 12 console.log(1); 13 } 14 15 console.log(test); //再次输出的就是已经被覆盖的函数——function(){console.log(1);}
  • 相关阅读:
    《不完美的她》开播,网友:周公子对「白帽子」有点误会吧?
    【Web安全】浅谈缓存XSS漏洞
    十分钟教你轻松掌握「移动PE导出表」,快来学习!
    干货分享丨表哥带你学习导入表及导入表注入
    「原创」萌新也能看懂的ThinkPHP3.2.3漏洞分析
    精选好文丨简析对称加密、非对称加密和混合加密
    工程师成长道路语录(转)
    在线画UML图的工具
    6种有效的开发模型(转)
    空降经理人的挑战 (原创)
  • 原文地址:https://www.cnblogs.com/Code-Inconnu/p/7391504.html
Copyright © 2011-2022 走看看