javascript核心技术（十六）变量与函数声明的自动提升效果

人亦已歌

我们先看以下代码：

console.log(num);//很显然，我们在输出num时，num还没有声明
var num = 200;//这里才声明了num

大家可以猜一下，执行后会输出什么呢？
答案是：会输出undefined。

为什么呢？

因为以上两行代码的执行过程如下：

var num; //js会自动将num的声明提前
console.log(num);//由于
num = 200;

由于num已声明未赋值，所以输出undefined。
之前我们在讲基本数据类型时曾讲过，undefined表示已定义未赋值。

下面我们再看一下函数中的变量是否同样有这样的自动将声明提升的效果

function fn(){
    console.log(num); // undefined
    var num = 200;
}
fn();

// 注意函数中的变量提升，只是提升到函数作用域的最前面
console.log(num); //所以这里会报错，因为函数外部并不存在一个num的变量

下面再看一下函数的声明是否同样具有自动提升的效果

fn();
function fn(){
    console.log(300);
}

输出结果为300，可见函数的声明同样会自动提升

但是，请注意：用表达式方式声明的函数，没有自动提升效果，如下：

console.log(f1);
f1();
var f1 = function(){
    console.log(400);
}

可以看到，先输出undefined，因为f1是一个变量，js会将变量的声明自动提升到最前面，所以第一条输出语句的f1是已定义为赋值，为undefined。
第二条语句为f1()，此时的f1只是一个普通变量，并非函数，所以报错。

真正的执行顺序如下：

var f1;
f1(); //报错 f1不是一个函数
f1 = function(){
    console.log(400);
}

所以总结如下：

1. 变量的声明会提前，赋值不会提前。
   
2. 变量的提升，是将变量的声明提升到当前作用域的最前面。
   
3. 函数的声明同样具有自动提升效果，我们将其称之为函数的预加载，但通过表达式声明的函数没有预加载效果。
   
4. 虽然变量具有自动提升效果，但不推荐变量先使用后声明。

复制代码

ok，以上就是关于变量与函数声明的自动提升效果的讲解，请大家务必认真理解以上逻辑。

语儿

如梦初醒，衷心感谢！！！！！！

saundiy

^真是厉害啊  谢谢你的点悟

chendaihua

从大体上说，我也可以算的上一个初级程序员吧，学的语言很多，不过都不是很精，软件工程学的一点都不好，大部分原因是在学校和老师，谁让我们在这样的垃圾学校拉，不过，我在c和vb上有一点基础，可以这样说，我在学校还可以吧，不过看了你的帖子，我感到我真的不行。    以后希望大家在c和vb和单片机的c51方面多说说，谢谢！

solomonzxh

^学习

海龙女

你写出了所有编程序人的心声  很好  我很受用  ~~~~~  ~~~~~~~~~~~~~~~~~~~~~~~~~  @@@@@@@@@@^^

ssplyhove

谢谢您的提醒。我好象也在犯你的错误

zfzv

谢谢你的经验。  非常感谢！

hwl

很有感悟　好文章

mynetuser

就像楼上说的那样，我也不知道自己是第几个回帖的，但是看了这篇文章后我没有办法不让自己回，是啊，我今年大2了，很多同学说编程难，都去学网页什么的了，而我却一早把自己出卖给了编程，我学的是C/C++，真的很难，不过我仍然在坚持，我也不知道前途会怎样，我只知道做自己最想做的事，就好了，很开心认识大家！！