专栏首页前端の进行时JavaScript 函数的定义

JavaScript 函数的定义

一、关于函数

JavaScript函数是指一个特定代码块,可能包含多条语句,可以通过名字来供其他语句调用以执行函数包含的代码语句。

比如我们有一个特定的功能需要三条语句实现

那么每次想实现这个功能的时候就需要写这三句话,很麻烦,我们可以把这三条语句打包为一个函数

这样每次想实现功能的时候我们就调用一下函数就可以了,调用函数通过函数名称()的形式调用

二、声明方式

ECMA规范只明确了一点:函数声明必须带有标示符(Identifier)(就是大家常说的函数名称),而函数表达式则可以省略这个标示符。

2.1 规则

(1)函数声明只能出现在 程序或函数体内。从句法上讲,它们不能出现在 Block(块)({ ... })中,例如不能出现在 if、while 或 for 语句中。因为 Block(块)中只能包含Statement语句, 而不能包含函数声明这样的源元素。

(2)另一方面,仔细看一看规则也会发现,唯一可能让表达式出现在Block(块)中情形,就是让它作为表达式语句的一部分。但是,规范明确规定了表达式语句不能以关键字function开头。而这实际上就是说,函数表达式同样也不能出现在Statement语句或Block(块)中(因为Block(块)就是由Statement语句构成的)。

三、函数声明(function 命令)

3.1 示例

上面的代码命名了一个job函数,以后使用job()这种形式,就可以调用相应的代码。这叫做函数的声明(Function Declaration)。

3.2 注意

(1)JavaScript 对大小写敏感。关键词 function 必须是小写的,并且必须以与函数名称相同的大小写来调用函数。

(2)funcname是要声明的函数名称的标识符。函数名之后的圆括号中是参数列表,参数之间使用逗号分隔。当调用函数时,这些标识符则指代传入函数的实参

(3)function语句里的花括号必需的,这和while循环和其他一些语句所使用的语句块是不同的,即使函数体内只包含一条语句,仍然必须使用花括号将其括起来。

四、函数表达式 (变量赋值)

4.1 定义

不以function开头的函数语句就是函数表达式。

4.2 匿名函数表达式

以表达式方式定义的函数,函数的名称是可选的,下面是匿名函数的一个例子,也就是函数没有名字

这种形式看起来好像是常规的变量赋值语句,即创建一个函数并将它赋值给变量myFunction。这种情况下创建的函数叫做匿名函数。因为function关键字后面没有标识符

4.3 命名函数表达式

当然function命令后面也可带有函数名,下面是在定义时为函数命名的例子

(1)命名函数表达式的好处是当我们遇到错误时,堆栈跟踪会显示函数名,容易寻找错误

(2)函数表达式其实是“忽略函数名称的,并且不可以使用函数名()这种形式调用函数。

4.4 被括号括住的(function foo(){})

这种函数表达式不太常见,他是表达式的原因是因为括号 ()是一个分组操作符,它的内部只能包含表达式。

4.5 注意

(1)函数表达式不会放到开头,所以不能在定义之前调用

(2)若命名函数表达式(加上函数名),则函数名只在函数体内部有效,在函数体外部无效

上面代码在函数表达式中,加入了函数名 x。这个 x 只在函数体内部可用,指代函数表达式本身,其他地方都不可用。这种写法的用处有两个,一是可以在函数体内部调用自身,二是方便除错(除错工具显示函数调用栈时,将显示函数名,而不再显示这里是一个匿名函数)。

(3)下面的形式声明函数也非常常见。

需要注意的是,函数的表达式需要在语句的结尾加上分号,表示语句结束。而函数的声明在结尾的大括号后面不用加分号。

五、函数声明和函数表达式的区别

5.1 说明

(1)如果不声明函数名称,他肯定是表达式。

(2)若声明了函数名称,可通过上下文来区分的,如果function test(){}是作为赋值表达式的一部分的话,那它就是一个函数表达式,如果function test(){}被包含在一个函数体内,或者位于程序的最顶部的话,那它就是一个函数声明

(4)函数声明会在任何表达式被解析和求值之前先被解析和求值,即使你的声明在代码的最后一行,它也会在同作用域内第一个表达式之前被解析/求值。

函数fn是在alert之后声明的,但是在alert执行的时候,fn已经有定义了。

(5)函数声明在条件语句内虽然可以用,但是没有被标准化,也就是说不同的环境可能有不同的执行结果,所以这样情况下,最好使用函数表达式。

六、Function 构造函数

6.1 示例

(1)下面代码中,Function构造函数接受三个参数,除了最后一个参数是sum函数的“函数体”,其他参数都是add函数的参数

(2)可以传递任意数量的参数给Function构造函数,只有最后一个参数会被当做函数体,如果只有一个参数,该参数就是函数体

6.2 注意

(1)Function构造函数无法指定函数名称,它创建的是一个匿名函数

(2)把Function的构造函数当作函数一样调用(不使用new操作符)的效果与作为Function的构造函数调用一样。

(3)从技术上讲,这是一个函数表达式。但不推荐使用,因为这种语法会导致解析两次代码。第一次是解析常规javascript代码,第二次解析传入构造函数中的字符串,影响性能。

阅读更多

参考文章 深入理解JavaScript系列(2):揭秘命名函数表达式

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

我来说两句

0 条评论
登录 后参与评论

相关文章

  • JavaScript-立即调用函数表达式(IIFE)

    (2)【注意】JavaScript引擎规定,如果function关键字出现在行首,一律解释成函数声明语句

    WEBING
  • JavaScript 函数参数-Arguments(实参)对象

    上式的 x 就是square函数的 参数。每次运行的时候,需要提供这个值,否则得不到结果。

    WEBING
  • JavaScript-变量/函数声明提升

    (1)如上定义了一个名为test的变量,但未给这个变量进行初始化(也就是没有赋值),此时其默认初始化值为 undefined。

    WEBING
  • 谈谈自己的理解:python中闭包,闭包

    闭包这个概念好难理解,身边朋友们好多都稀里糊涂的,稀里糊涂的林老冷希望写下这篇文章能够对稀里糊涂的伙伴们有一些帮助~

    py3study
  • JS中函数声明与函数表达式的异同

    相同点 注:函数声明和函数表达式的相同点包括但不限于以下几点 函数是一个值,所以和其他值一样,函数也可以进行被输出、被赋值、作为参数传给其他函数等相关操作,不...

    蓓蕾心晴
  • Python数据类型之字符串第四季

    各位小伙伴们 “黑一”快乐 本节课非常非常重要 请各位小伙伴 一定认真理解和学习 技术要点: 内建函数 函数的理解 如何使用一个函数 capitalize()函...

    企鹅号小编
  • 浅谈如何定义和调用Python的函数

    函数是python编程核心内容之一,笔者在本文中主要介绍下函数的概念和基础函数相关知识点。函数是什么?有什么作用、定义函数的方法及如何调用函数。 函数是可以实现...

    企鹅号小编
  • Python 基础 高阶函数

    python 把函数作为参数   如果传入abs 作为参数     def add(x,y,y):       return f(x) + f(y)     a...

    用户1197315
  • 写 Python 代码不可不知的函数式编程技术

    近来,越来越多人使用函数式编程(functional programming)。因此,很多传统的命令式语言(如 Java 和 Python)开始支持函数式编程技...

    机器之心
  • 写 Python 代码不可不知的函数式编程技术

    近来,越来越多人使用函数式编程(functional programming)。因此,很多传统的命令式语言(如 Java 和 Python)开始支持函数式编程技...

    CDA数据分析师

扫码关注云+社区

领取腾讯云代金券