JS中变量的声明提前和函数的声明提前

变量的声明提前

• 使用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(){} 创建的函数不会被提前创建，一定要在函数后面调用。

本文地址：https://blog.csdn.net/weixin_46452134/article/details/111144111