JavaScript变量提升

1、概念

在JS中使用var来声明变量时，在预编译的过程中，会提升到当前作用域的顶端，赋值undefined，而赋值操作在原处不变。

2、变量提升

变量声明

console.log(a);//输出undefined
var a = 10;
console.log(a);//上面给a赋值的语句执行完毕，所以输出10

3、函数提升

常见的函数定义的方式由两种：函数声明和函数表达式

//函数表达式
var fn1 = function(){}
//函数声明
function fn2(){}

函数表达式声明和变量声明相同，如下所示，将fn1声明提升，赋值undefined。

console.log(fn1);//输出undefined
var fn1 = function(){};

函数声明略有不同，如下所示，将fn2声明提升，内容也会提升。

console.log(fn2);//输出ƒ fn2(){}
function fn2(){}

4、不同script标签中的变量提升

如下面代码所示，两个语句在不同的script标签中

<script>
	console.log(c);
</script>
<script>
	var c = 10;
</script>

此时运行代码结果如下图所示

此时浏览器报错。由此可以得出结论是变量提升不能跨script标签。

5、知识点总结

• 在JS中使用var来声明变量时,会提升到当前作用域的顶端,而赋值操作在原处不变
• 函数表达式提升和变量提升一样,表达式提升赋值undefined
• 函数声明表达式提升赋值函数内容
• 变量提升不能跨script标签