JavaScript | 函数定义的两种方法;预编译与执行

HTML5学堂(码匠):在JavaScript当中,函数的定义有两种常见方法,这两种方法有何不同?与这种不同点息息相关的“预编译与执行”又是什么意思?

1.如何定义函数

方法1:函数声明

方法2:函数表达式,又叫函数字面量

2.声明函数的代码实例

2.1.函数声明

基本语法

function functionName(arg0, arg1, ..., argn) {
    // 函数体 - HTML5学堂
}

代码范例

2.2.函数表达式(函数字面量)

基本语法

var functionName = function(arg0, arg1, ..., argn) {
    // 函数体 - HTML5学堂
};

代码范例

3.两种声明方法的不同点比较

在JavaScript运行过程中分为编译和执行两个阶段,在编译阶段解析器会先读取函数声明,并使其在执行任何代码之前可以访问;

因此,对于“函数声明”,在执行代码之前,函数就会先被读取,因此,在开发时可以把函数声明放在调用语句的后面

但是,对于“函数表达式”,则必须等到执行阶段解析器执行到它所在的代码行时,才会真正被解释执行

相关知识 - 预编译与执行

预编译期与执行期

JS的解析过程分为两个阶段:预编译期与执行期。

预编译期JS会对本代码块中的所有声明的变量(var声明的变量)和函数进行处理,但需要注意的是此时处理函数的只是声明式函数,而且变量也只是进行了声明但并不进行赋值

代码范例:

代码运行结果

undefined 'HTML5学堂(码匠)'

代码解析

预编译时,对声明的变量开辟了内存空间,但是没有赋值,所以变量里面的值是undefined。执行期的时候,代码是从上往下执行,没有对第一个username进行赋值,所以第一个username输出undefined。

第二个username会输出'HTML5学堂(码匠)',是因为代码执行到var a = 'HTML5学堂(码匠)'; 的时候为username进行赋值了,覆盖之前undefined的值。

Plus

JS引擎是按照代码块(<script></script>)来进行预处理和执行的,也就是说预处理的只是当前执行代码块的声明函数和变量。

原文发布于微信公众号 - HTML5学堂(h5course-com)

原文发表时间:2017-03-02

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏每日一篇技术文章

Swift3.0 - 流控制

需求二: 输入一个顶点 判断是否在X轴上,或者Y轴上,或者既不在x轴,也不再Y轴上

742
来自专栏技术博文

JQuery处理json与ajax返回JSON实例

json数据是一种经型的实时数据交互的数据存储方法,使用到最多的应该是ajax与json配合使用了,下面我来给大家介绍jquery处理json数据方法。 JSO...

3546
来自专栏Golang语言社区

Go语言基本的语法和内置数据类型初探

Go令牌 Go程序包括各种令牌和令牌可以是一个关键字,一个标识符,常量,字符串文字或符号。例如,下面的Go语句由六个令牌: fmt.Println("Hell...

2715
来自专栏Laoqi's Linux运维专列

python3–函数

39411
来自专栏吴伟祥

MySQL中字节、编码、长度、值的关系 原

0.一个汉字占多少字节与编码有关:          UTF-8:一个汉字=3个字节             GBK:一个汉字=2个字节  1.var...

803
来自专栏我是业余自学C/C++的

strlen()

1403
来自专栏个人随笔

房上的猫:if选择结构

一.基本if结构: ? ?  1.定义:if选择结构是根据条件判断之后再做处理的一种语法结构!  2.逻辑:首先对条件进行判断   >如果为真,则执行代码块 ...

35812
来自专栏Golang语言社区

Go语言语法汇总

最近看了看GoLang,把Go语言的语法总结了一下,做个快速参考 数据类型 ---- var varName type,var var1,var2… type,...

34113
来自专栏Ryan Miao

String的内存模型,为什么String被设计成不可变的

String是Java中最常用的类,是不可变的(Immutable), 那么String是如何实现Immutable呢,String为什么要设计成不可变呢? 前...

32813
来自专栏大前端_Web

jsvascript—谜之this?

版权声明:本文为吴孔云博客原创文章,转载请注明出处并带上链接,谢谢。 https://blog.csdn.net/wkyseo/articl...

1324

扫码关注云+社区