Js中有关变量声明和函数声明提升的问题

在ECMAScript5中没有块级作用域一说，只有函数作用域和全局作用域，在其中声明的变量和函数和其他语言的展现形式不同，在某些情况下不一定需要先定义后使用，函数和变量的使用可以在其声明之前，这到底是怎么回事呢？让我们一起揭开变量声明提前的神秘面纱！！！

一、变量声明提升

 var a = 10;
 function test() {
        a = 100;
        alert(a);
        alert(this.a);
        var a;
        alert(a);
         }
  test();

这题考的也是变量声明提升，函数作用域中提前使用变量时一定要注意下面是否有利用var声明，如果有会将其提升，而不是使用外面的全局变量。相当于如下代码：

 var a = 10;
 function test() {
     var a;
     a = 100;
     alert(a);//
     alert(this.a);//
     alert(a);//
 }
 test();
 //所以输出的结果是 100 10 100

同时要注意在同一作用域内利用var定义多个同名变量如果后面没有赋值，这该变量的值仍是上一次所附的值，如下：

 var a = 100;
 var a;
 console.log(a) //

二、函数的声明提升

先上题，看看下体应该输出的结果是什么：

（1）第一题：

 f = function () { return true; };
 g = function () { return false; };
 (function () {
     if (g() && [] == ![]) {
         f = function f() { return false; };
         g = function() { return true; }
     }
 })();
 alert(f());

输出的结果是true ,函数的声明会被提前，但是函数表达式是不会被提前的，在if条件判断中的f和g均为函数表达式，所以均不会被提前,使用全局的变量进行判断,,if中的结果如下：

 var s1 = g();//false
 var s2 = g() && []; //false
 var s3 = ![]; //false
 var s4 = g() && [] == ![]; //false(此处注意运算符的优先级条件运算符的优先级高于逻辑运算，所以先执行后面的，在执行前面的)
 var s5 = (g() && []) == ![]; //true
 //所以最后的结果为true。

（2）如果将上面的稍作改变结果会是怎样呢？

 f = function () { return true; };
 g = function () { return false; };
 (function () {
     if (g() && [] == ![]) {
         f = function f() { return false; };
       function g() { return true; }  //(1)
     }
 })();
 alert(f());

此题中if中的g函数的声明会被提前，但是定义不会被提前（这个下面将会提到），所以if中使用的将不会 是全局的函数g，而是局部变量，但是虽然g进行了声明，但是没有定义故会报错g is not a function 。如果将(1)式变为 var g = function(){};这样也会报同样的错误，但是后者相当于是函数表达式，提升的是var定义的变量而不是函数的声明，这一点要注意区分的。

三、经过上面的练习你一定好奇函数的声明提前到底是怎么回事，下面我们就函数的声明和定义提前好好聊聊（此处将排开函数表达式，因为函数表达式是不会被提前的）

ES5中有规定不要将函数定义在语句块中，也就是函数可以在全局作用域和函数作用域中被声明和定义，但不要在if等语句块中当定义和声明。在全局和函数作用域中定义的函数的声明和定义豆浆会被提前到当前作用域的顶部。但是if，和for中声明的函数在非严格模式下不会报错，但是不同的浏览器可能表现不同。在谷歌中，在if 等语句块中声明的函数的声明会被提前但是函数的定义将不会被提前。所以在块语句里面最好是使用函数表达式，而不是函数的声明。

（1）   函数的声明和定义均被提前到当前作用域的顶部

 f();
 function f(){
 console.log("ok")
 }
 // 输出结果ok   函数的声明和定义均被提前

（2）IIFE中定义的函数（相当于函数中定义的函数）

 (function(){
  f();
 function f (){
 Console.log(“hello”)
 }
 })()
  //输出的结果是 hello

（3）if块中定义的函数

 console.log(f)
 f();
 if(false){
 function f(){
 console.log("ok")
 }
 }  //输出undefined后，报错f  is not a function 说明在if语句块中的函数的声明被提前但是函数的定义没被提前

（4）for语句块中定义的函数

 1 console.log(f)
 2 f()
 3 for(f();false;){
 4 function f(){console.log("ok")}}
 5 //输出undefined后，报错f  is not a function 说明在for语句块中的函数的声明被提前但是函数的定义没被提前    

以上便是个人对变量提升的见解如有不足之处，请指教

转载请注明出处：http://www.cnblogs.com/heshan1992/p/7262387.html