什么是JavaScript 预解析

这是我参与8月更文挑战的第10天，活动详情查看：8月更文挑战

JavaScript 代码的执行是由浏览器中的 JavaScript 解析器来执行的。JavaScript 解析器执行JavaScript 代码的时候，分为两个过程：预解析过程和代码执行过程

预解析过程

预解析过程：

1. 把变量的声明提高到当前做用域的最前面，只会提高声明，不会提高赋值。

2. 把函数的声明提高到当前做用域的最前面，只会提高声明，不会提高调用。

3. 先提高 var，再提高 function。

变量声明提高

在预解析过程当中，全部定义的变量，都会将声明的过程提高到所在的做用域最上面，在未来的代码执行过程当中，按照前后顺序会先执行被提高的声明变量过程。

提高过程当中，只提高声明过程，不提高变量赋值，至关于变量定义未赋值，变量内存储 undefined 值。

所以，在 js 中会出现一种现象，在前面调用后定义的变量，不会报错，只会使用 undefined 值。

函数声明提高

在预解析过程当中，全部定义的函数，都会将声明的过程提高到所在的做用域最上面，在未来的代码执行过程当中，按照前后顺序会先执行被提高的函数声明过程。

在预解析以后的代码执行过程当中，函数定义过程已经在最开始就会执行，一旦函数定义成功，后续就能够直接调用函数。

所以，在 js 中会出现一种现象，在前面调用后定义的函数，不会报错，并且能正常执行函数内部的代码。

函数声明提高能够用于调整代码的顺序，将大段的定义过程放到代码最后，可是不影响代码执行效果。

console.log(a);
        console.log(fun)

        function fun(){
            console.log(2);
        }

        var a=1;
        console.log(a);
复制代码

提高顺序

预解析过程当中，先提高 var 变量声明，再提高 function 函数声明。

假设出现变量名和函数名相同，那么后提高的函数名标识符会覆盖先提高的变量名，那么在后续代码中出现调用标识符时，内部是函数的定义过程，而不是 undefined。

若是调用标识符的过程在源代码函数和变量定义后面，至关于函数名覆盖了一次变量名，结果在执行到变量赋值时，又被新值覆盖了函数的值，那么在后面再次调用标识符，用的就是变量存的新值。

建议：不要书写相同的标识符给变量名或函数名，避免出现覆盖。

console.log(fun);

        var fun;

        function fun(){
            console.log(2);
        }

        console.log(fun);  //能够看到既有变量又有函数时, 最后输出fun是什么

        fun = "hello";  //字符串不能传给函数, 因此后面一行调用函数时会报错
        fun()
复制代码

能够看到在上面代码中, 既有fun变量, 又有fun函数的代码中, 后面提高的函数会覆盖先前提高的变量, 因此最后fun指的是函数, 再给他赋值一个字符串, 就会报错了.

函数表达式的提高

在预解析过程当中，函数表达式进行的是变量声明提高，而不是函数声明提高。提高后变量内部存的是一个 undefined。在前面进行函数方法调用，数据类型会提示错误。

建议：定义函数时，最好使用 function 关键字定义方式，这样函数声明提高能够永远生效。

console.log(foo);

        var foo = function(){
            console.log(3)
        }

        console.log(foo);
        foo();
复制代码

代码执行过程

在预解析以后，根据新的代码顺序，从上往下按照既定规律执行 js 代码。