JS中变量提升与函数提升

变量提升与函数提升

变量提升

1. 有var声明：

先看一个例子吧
案例一：

console.log(a); //undefined
var a=10;
console.log(a); //10

在程序进入当前代码块时，首先会所有有var声明的变量隐式提前到当前代码块的最前面（可能是全局变量、也可能是局部变量，具体看当前代码块的位置）。所有这里将var a; 隐式提前，代码相当于

var a;          
console.log(a);
a=10;
console.log(a);

第一个打印时，声明了变量a但是没有初始化，打印undefined
第二个打印时，声明了变量a并且初始化为20，打印20

1. 没有var声明：

同样，先看例子
案例一：

console.log(a); //a is not defined
a=10;

在程序运行到变量赋值这一行的时候才会出现变量提升（隐式提升为全局变量）
所以在打印时变量a没有声明没有初始化，程序报错。

案例二：

function fn(){
    a=10;
}
fn();
console.log(a); //10

在函数fn()代码块运行时，运行到代码a=10时，出现变量提升（隐式提升为全局变量）,会将var a; 隐式提升到函数体外面，代码相当于

var a;      
function fn(){
    a=10;
}
fn();
console.log(a); 

所以在打印时变量a已经声明并且初始化了，打印10。

函数提升

js中创建函数有两种方式：函数声明式和函数表达式。
只有函数声明才存在函数提升！函数提升会把整个函数包括内容全部提升

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

同样，先看例子
案例一：

console.log(fn1); //ƒ fn1(){}
console.log(fn2); //undefined
function fn1(){}
var fn2=function(){}

代码相当于

var fn2;
function fn1(){}
console.log(fn1);
console.log(fn2);
fn2=function(){}

使用函数声明式创建函数的fn1出现函数提升，而使用函数表达式创建函数的fn2不会出现函数提升，但是使用var声明的变量会出现变量提升。

变量提升与函数提升

从上面我们知道函数和变量都会提升，但是谁在前谁在后呢？看例子吧！
案例一：

console.log(a); //ƒ a(){}
var a=10;
function a(){}
console.log(a); //10
console.log(a()); //a is not a function

由此可见：

函数提升要比变量提升的优先级要高一些，且不会被变量声明覆盖，但是会在变量赋值之后被变量覆盖。

其实函数和变量的提升的位置，谁在前谁在后，并不影响结果，只要记得上面这句话即可.