JavaScript的解析顺序对函数有何影响？

我不是女神ヾ 2021-09-18 14:08 269阅读 0赞

## **1.函数的定义方式** ##

我们都知道,在JavaScript中有两种定义函数的方式，分别为声明式函数和赋值式函数，但是两种函数在执行顺序却有不同。

比如：

声明式

<script>
        fn();       //      1
        function fu(){
            console.log(1)
        }
    </script>

赋值式

<script>
        fn();       // fn is not a function
        var fn = function(){
            console.log(1)
        }
    </script>

在声明式的函数中，函数在未定义之间执行没有任何问题，会在控制台中打印`1`，但是赋值式的就会报错，会告诉你`fn`不是一个函数，这是为什么呢？这就要从JavaScript的解析顺序说起。

## **2.JavaScript解析顺序** ##

JavaScript解析顺序分为预编译期与执行期。

也就是说JavaScript在执行代码之前会先进行预编译，在预编译期JavaScript会对本代码块中所有声明的变量和函数进行预处理，需要注意的是这里面只会将变量进行声明，但不进行初始化赋值，而且这里面处理的函数是声明式的函数。

举个例子：

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

JavaScript在处理上面的代码时，先预编译，简单理解，就是将所有变量声明和声明式函数先读一遍，也就是说在代码执行之前,JavaScript已经知道这段代码中有两个变量`a`,`b`和一个函数体`fn`可以这样理解Javascript先建立一个仓库把他们存起来。

<script>
        // 预编译阶段
        var a,
        var b,
        function fn(){
            console.log(1)
        };
    </script>

接下来就是执行阶段,执行阶段就没什么好说的了,就是代码一行一行执行

<script>
        // 预编译阶段
        var a,
        var b,
        function fn(){
            console.log(1)
        };
        //执行阶段
        fn();        //结果打印: 1
        a =3;        //将a进行初始化复制
        b();        // 发现仓库里有b,但此时b为初始化赋值前,是undefined,不是一个函数,
    这里就会报错, b is not a function 
        b = function(){   // 给b赋值一个函数,但是因为上一行代码出错,这里将停止执行
            console.log(1)
        }
    </script>

如果有其他疑问或是看法可以在评论里或投稿跟小编进行讨论，  
也可以关注微信公众号【筑梦前端】进行投稿，与小编一起探讨更多的编程知识。

发表评论取消回复

表情：

评论列表（有 0 条评论，269人围观）

还没有评论，来说两句吧...

相关阅读

相关性能优化问题：Java中的对象池设计和使用对性能提升有何影响？

Java中的对象池（Object Pool）是一种设计模式，用于管理对象的创建和销毁，以提高性能和资源利用率。对象池通过重用一组初始化过的对象来减少创建和销毁对象的开销，特别是

梦里梦外;/ 2024年11月06日 03:30/ 0 赞/ 12 阅读

相关 JavaScript中的预解析顺序（优先级）

理执行上下文代码分为两个阶段：进入执行上下文执行代码进入执行上下文：进入执行上下文，方法的变量对象（VO）就会被以下属性填充参数，参数名就是...

朴灿烈づ我的快乐病毒、/ 2024年04月17日 05:55/ 0 赞/ 70 阅读

相关 JSP与JavaScript有何区别

![a6821de542bcecad85d4c4594e1ba25c.jpeg][] JSP和JavaScript有什么区别 1 JaVa是和c/c++一个等级的强类型编程

我就是我/ 2024年03月27日 11:25/ 0 赞/ 81 阅读

相关 JavaScript 与Java有何关系

![de39f2d646630f940b57b4788f22e5d2.jpeg][] 很多人看到JavaScript和Java这两种编程语言，就会自然而然地想知道这两者究竟有

梦里梦外;/ 2024年03月26日 16:02/ 0 赞/ 56 阅读

相关 CSS优先级和媒体查询：解析代码块顺序对样式应用的影响

这里存在两种情况，第一个代码块和第二个代码块的顺序和CSS样式规则的优先级。在CSS中，样式的优先级决定了哪些规则会被应用到元素上。首先，让我们来解释这两种情况以及它们的行为方

╰+哭是因爲堅強的太久メ/ 2024年02月05日 19:56/ 0 赞/ 25 阅读

相关 JavaScript的函数解析（一）

JavaScript的函数今天和大家说一下js中一个比较重要的内容，函数。 JavaScript 函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。

冷不防/ 2023年03月13日 13:15/ 0 赞/ 2 阅读

相关【Python】PYTHONHOME与PYTHONPATH对模块搜索顺序的影响

PYTHONHOME指定两个目录；PYTHONPATH指定一个目录 [tony@centos8 ~]$ PYTHONHOME=/home/tony/.loca

ゝ一纸荒年。/ 2022年12月07日 15:15/ 0 赞/ 155 阅读

相关那些书对程序员最有影响

转载一篇文章来自：[外刊IT评论][IT] 国外知名网站[stackoverflow][]上有一个问题调查：哪本书是对程序员最有影响、每个程序员都该阅读的书？

迈不过友情╰/ 2022年09月18日 11:51/ 0 赞/ 174 阅读

相关 jsp中对javascript的影响

jsp中加了<base href="<%=bathpath %>" 有时会使javascript不起作用。如： windows.self.location="item\

今天药忘吃喽~/ 2022年06月12日 12:58/ 0 赞/ 197 阅读

相关 JavaScript的解析顺序对函数有何影响？

1.函数的定义方式我们都知道,在JavaScript中有两种定义函数的方式，分别为声明式函数和赋值式函数，但是两种函数在执行顺序却有不同。比如：

我不是女神ヾ/ 2021年09月18日 14:08/ 0 赞/ 270 阅读