此次说明的是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);}

 

posted on 2017-08-18 19:38  未知代码  阅读(159)  评论(0编辑  收藏  举报