变量的声明提前
- 使用var关键字声明的变量,会在所有的代码执行之前被声明(但是不会赋值,它会在执行到那行代码的时候,才会有值),但是如果声明变量时不使用var关键字,则变量不会被声明提前。可能看起来会有点绕,让我们来看例子理解一下吧!
例1:
<script type="text/javascript">
var a;
console.log("a = " + a);
a = 123;
</script>
运行结果:
在这个例子中,我先提前定义了一个变量a,但是我并没有给a进行赋值,所以输出的是undefined(a的赋值是在执行代码后面,只有当a的赋值在执行代码前面,a才会输出值,否则都是undefined)。如下:
例2:
<script type="text/javascript">
var a = 123;
console.log("a = " + a);
</script>
运行结果:
例3:
<script type="text/javascript">
console.log("a = " + a);
var a = 123;
</script>
运行结果:
在这个例子中,为什么同样也是输出undefined呢?因为变量的声明提前,我使用的是var关键字声明的变量,不论我var定义在执行的代码后面还是前面,他都会提前将我定义的变量进行声明,但是不会进行赋值。但是我如果没有使用var关键字进行声明变量呢?让我们继续来看一下:
例4:
<script type="text/javascript">
console.log("a = " + a);
a = 123;
</script>
运行结果:
我们发现,如果没有使用var关键字进行变量声明时,会报错!
函数的声明提前
- 使用函数声明形式创建的函数 function 函数(){},它会在所有的代码执行之前就被创建,所以我们可以在函数声明前来调用函数。我们一样通过例子来理解一下:
例1:
<script type="text/javascript">
fun();
function fun(){
console.log("这是我的第一个函数");
}
var fun2 = function(){
console.log("这是我的第二个函数");
}
</script>
运行结果:
在这个例子中,我们发现,在函数声明之前我们就先调用了fun()函数,这就是函数的声明提前,所以这种形式的函数位置放在哪里都是一样的,都是先被创建。那么fun2()函数也能如此吗?
例2:
<script type="text/javascript">
fun2();
function fun(){
console.log("这是我的第一个函数");
}
var fun2 = function(){
console.log("这是我的第二个函数");
}
</script>
运行结果:
哦吼!报错了,让我们先来检查一下变量fun2
<script type="text/javascript">
console.log(fun2);
function fun(){
console.log("这是我的第一个函数");
}
var fun2 = function(){
console.log("这是我的第二个函数");
}
</script>
运行结果:
发现没,因为第二个函数是关键字var变量声明的(变量声明提前和函数声明提前是不一样的噢,不要搞混了),所以有声明提前,但是没有赋值,所以输出undefined。但是undefined不是函数,所以一调用就会报错。
- 总结例2,就是使用函数表达式创建的函数,不会被声明提前,所以不能在声明前调用。
总的来说就是使用函数声明function fun(){} 形式的函数会被提前创建,函数表达式var fun2 = function(){} 创建的函数不会被提前创建,一定要在函数后面调用。