JS预解析

什么是预解析

JavaScript引擎在对JavaScript代码进行解释执行之前，会对JavaScript代码进行预解析，在预解析阶段，会将以关键字var和function开头的语句块提前进行处理。

如何处理

当变量和函数的声明处在作用域比较靠后的位置的时候，变量和函数的声明会被提升到作用域的开头。

(1)、函数提升

func();
function func(){
    alert("Funciton has been called");
}

由于JavaScript的预解析机制，上面的代码就等效于：

function func(){
    alert("Funciton has been called");
}
func()

(2)、变量提升

alert(a);
var a = 1;

我们说的提升，是声明的提升。

var a; //这里是声明
alert(a);//变量声明之后并未有初始化和赋值操作，所以这里是 undefined
a = 1

所以变量的提升只是声明的提升

(3)、函数同名

func1();
function func1(){
    console.log('This is func1');
}
func1();
function func1(){
    console.log('This is last func1');
}

输出结果为

This is last func1

This is last func1

原因分析：由于预解析机制，func1的声明会被提升，提升之后的代码为

function func1(){
console.log('This is last func1');
}
func1();
func1();

同名的函数，后面的会覆盖前面的，所以两次输出结果都是This is last func1。

(4)、变量和函数同名

alert(foo);
function foo(){}
var foo = 2;

当出现变量声明和函数同名的时候，只会对函数声明进行提升，变量会被忽略。所以上面的代码的输出结果为：function foo(){}

function foo(){};
alert(foo);
foo = 2;

(5)、预解析是分作用域的

提升原则是提升到变量运行的环境(作用域)中去。

function showMsg()
{
var msg = 'This is message';
}
alert(msg); // msg未定义

预解析之后的代码：

function showMsg()
{
var msg;
msg = 'This is message';
}
alert(msg); // msg未定义

(6)、函数表达式不会提升

func();
var func = function(){
    alert("我被提升了");
};

这里会直接报错，func is not a function，原因就是函数表达式，并不会被提升。只是简单地当做变量声明进行了处理，如下：

var func;
func();
func = function(){
    alert("我被提升了");
}