跳到主要内容

12-JavaScript预解析

浏览器在执行JS代码的时候会分成两部分操作：预解析以及逐行执行代码
浏览器不会直接执行代码, 而是加工处理之后再执行,这个加工处理的过程, 我们就称之为预解析

预解析规则

将变量声明和函数声明提升到当前作用域最前面
将剩余代码按照书写顺序依次放到后面

预解析注意点

类似C语言中的就近原则

ES6之前定义函数的格式

console.log(say);                    //  function say() {
say();                               //      console.log("hello it666");
function say() {                     //      console.log("hello it666");
    console.log("hello it666");      //
}                                    //  }
                                     //  say();

如果将函数赋值给一个var定义的变量, 那么函数不会被预解析, 只有变量会被预解析

say(); // say is not a function
var say = function() {
    console.log("hello itzb");
}

var say; //undefined
say();
say = function() {
    console.log("hello itzb");
}

ES6定义函数的格式

say(); // say is not defined
let say = () => {
    console.log("hello itzb");
}

将当前JavaScript代码中所有变量的定义和函数的定义放到所有代码的最前面

var a = 666;           //   var a;
test();                //     function test() {
function test() {      //         var b;
    var b = 777;       //         var a;
    console.log(a);    //         b = 777;
    console.log(b);    //         console.log(a); // 结果为：undefined
    console.log(c);    //         console.log(b); // 结果为：777
    var a = 888;       //         console.log(c); // 结果为：报错
    let c = 999;       //         a = 888;
}                      //         let c = 999;
                       //   }
                       //   a = 666;
                       //   test();

如果变量名称和函数名称同名，那么函数的优先级高于变量
在ES6之前没有块级作用域，并且没有将这两个函数定义到其它的函数中，这两个函数应该属于全局作用域
- ⚠️注意在高级浏览器中, 不会对{}中定义的函数进行提升。在低级浏览器中, 才会按照正常的方式解析。如：IE10等

预解析规则
- 预解析注意点