美文网首页
js预解析

js预解析

作者: 张鸽 | 来源:发表于2018-05-05 17:35 被阅读0次

    首先来一个简单的代码:

    <script>
        console.log(a);
        var a = 10;
        console.log(a);
        function a() {
            var b = 1;
        }
        console.log(a);
        var a = function() {
            var b = 2;
        };
        console.log(a);
    </script>
    

    那么结果是什么呢?
    我本来以为是undefined、10、function a() { var b = 1; }、function() { var b = 2; }
    但是结果却是这样的:



    为什么会这样呢,是因为 js 在正常解析前先进行预解析,那么如何预解析呢?

    • var 预解析
      js 在正常解析之前,会快速的把 script (或者 funciton )中的 var 声明及声明的名字,提升到代码块(作用域)的最前面。
    • function 预解析
      js 在正常解析之前,会快速的把 script (或者 funciton )中的 function 及内容提升到代码块(作用域)的最前面,跟在 var 声明之后。

    在预解析时,会产生一个仓库,存储声明的变量和函数,如果变量或函数有同名的情况,则覆盖前面的,只留一个。在解析代码时,在这个仓库里找同名的变量或是函数

    下面是我对上面例子的预解析过程的理解:
    第一步对 var、function 提升:

        var a;
        var a;
        function a() {
            var b = 1;
        }
        console.log(a);
        a = 10;
        console.log(a);
        console.log(a);
        a = function() {
            var b = 2;
        };
        console.log(a);
    

    第二步同名覆盖:

        function a() {
            var b = 1;
        }
        console.log(a);
        a = 10;
        console.log(a);
        console.log(a);
        a = function() {
            var b = 2;
        };
        console.log(a);
    

    预解析后, js 会从上到下一行一行执行,遇到表达式时,如果表达式对变量进行修改,则修改预解析的值。就像上面的yu

    总结:感觉自己要巩固基础

    相关文章

      网友评论

          本文标题:js预解析

          本文链接:https://www.haomeiwen.com/subject/twherftx.html