代码预解析

最新推荐文章于 2024-10-02 05:39:15 发布

黄酱！

最新推荐文章于 2024-10-02 05:39:15 发布

阅读量157

点赞数

分类专栏： JS 文章标签： javascript

本文链接：https://blog.csdn.net/tianranran/article/details/121543616

版权

JS 专栏收录该内容

91 篇文章 2 订阅

订阅专栏

本文详细介绍了JavaScript中的预解析机制，包括函数声明和变量声明的提升。讲解了预解析如何影响同名函数和变量的处理，并通过示例解释了预解析在if语句和return语句中的行为。此外，还探讨了函数作用域和变量作用域的概念，帮助读者深入理解JavaScript执行上下文的关键点。

摘要由CSDN通过智能技术生成

标题代码预解析

预解析

        javascript源代码   ->   浏览器加载执行  -> 输出结果 
                           |
                          预解析
                        1. 声明式函数提到代码最上面
                        2. var 声明的变量提到代码最上面

     -->
</head>
<body>
    <script>

        fn()
        console.log('f1 ',f );
        function fn(){
            console.log('fn >>>')
        }

        var f = 100

        console.log('f2 ',f );


        // function fn(){
        //     console.log('fn >>>')
        // }
        // var f
        // fn()
        // f = 100

 <!-- 
        当遇到同名函数和变量时
          => 预解析优先处理函数


     -->
</head>
<body>
    <script>

        fn()
        function fn(){
            console.log('fn >>>');
        }
        fn()
        var fn = 100
        fn()

        // function fn(){
        //     console.log('fn >>>');
        // }
        // var fn

        // fn() // 函数调用语句
        // fn()
        // fn = 100 // 变量赋值
        // fn()  // fn 不是一个函数



if语句块不管条件是否满足都会执行预解析
 console.log('num 11', num);
        if (3 > 5) {
            var num = 100
        }
        console.log('num 22 ', num);

return语句后的代码也会预解析

function fn() {
            console.log(num) // num is not defined
            if (true) {
                return
            }
            var num = 100
            console.log(num)
        }

        fn()

练习

 console.log(num)
        var num = 10
        f()
        console.log(f2)

        function f() {
            console.log(n)
            var n = 20
            console.log(n)
        }
        console.log(num)
        var f2 = function () {
            console.log('我是f2')
        }

        // var num
        // var n
        // var f2

        // function f() {
        //     console.log(n) // undefined
        //     n = 20   
        //     console.log(n)  //20
        // }

        // //----------------------
        // console.log(num)  //undefined
        // num = 10  
        // f()
        // console.log(f2) //undefined
        // console.log(num) // 10
        // f2 = function () {
        //     console.log('我是f2')
        // }