函数声明与函数表达式

函数声明

一个标准的函数声明,由关键字function 、函数名、形参和代码块组成。

有名字的函数又叫具名函数

举个例子:

function quack(num) {
for (var i = 0; i < num; i++) {console.log("Quack!")}
}
quack(3)

函数表达式

函数没有名称,而且位于一条赋值语句右边,被赋给一个变量。

在语句(如赋值语句)中,以这样的方式使用关键function时,创建的是函数表达式。

没有名称的函数又叫匿名函数

举个例子:

var fly = function(num) {for (var i = 0; i < num; i++) {console.log("Flying!");}
}
fly(3)

下面是一个关于如何区分函数声明和函数表达式的简单提示:

如果语句以function关键字开头,那么它就是一个函数声明,否则就是一个函数表达式。

(当function关键字在表达式中创建一个函数(有或没有名称)时,才是一个函数表达式。)

// 函数声明: 以 `function` 关键字开头
function sumA(a, b) {return a + b;
}// 函数表达式: 不以 `function` 关键字开头
const mySum = (function sumB(a, b) {return a + b;
});// 函数表达式: 不以 `function` 关键字开头
[1, 2, 3].reduce(function sum3(acc, number) { return acc + number 
});// 函数表达式const sum = (function sumB(a, b) {return a + b;
});// 函数表达式
const myObject = {myMethod: function() {return 42;}
};// 函数表达式
const numbers = [4, 1, 6];
numbers.forEach(function callback(number) {console.log(number);// logs 4// logs 1// logs 1
});

在函数表达式中创建的函数有两种:

  1. 如果表达式内的函数没有名称,例如function() {return 42},则这是一个匿名函数表达式;
  2. 如果函数有名字,例如前面例子中的sumBcallback,那么这就是一个命名函数表达式

从更高的角度来看,函数声明对于创建独立的函数很有用,但是函数表达式作为回调很好。

现在,让我们深入了解函数声明和函数表达式的行为。

乍一看,函数声明和函数表达式差别不大,但实际上它们存在根本性差别。

要明白这种差别,首先需要研究一下浏览器在运行阶段如何处理代码。

举个例子,看看浏览器如何分析并执行网页中的代码。

var migrating = true;
var fly = function (num) {for (var i = 0; i < num; i++) {console.log("Flying!")}
}function quack(num) {for (var i = 0; i < num; i++) {console.log("Quack!")}
}if (migrating) {quack(4)fly(4)
}

分析浏览器如何执行代码

第一步:分析函数声明

在分析网页期间(执行任何代码之前),浏览器查找函数声明。找到函数声明时,浏览器创建相应的函数,并将得到的函数引用赋给与函数同名的变量。

第二步:浏览器执行代码

处理所有的函数声明后,浏览器回到代码开头,开始按从头到尾的顺序执行代码。

 

第三步:继续执行

处理完变量fly后,浏览器继续往下执行。接下来的语句是函数quack的声明,因为已经处理过了,所以浏览器跳过声明,接着执行后面的条件语句。

小结一下,浏览器的执行过程:

  1. 首先扫描代码,查找函数声明
  2. 分析函数声明(存储该函数,并创建一个与函数同名变量来存储指向该函数的引用)
  3. 处理完所有函数声明后,浏览器从头开始执行代码(按顺序处理各种函数变量)
  4. 碰到函数表达式时,同函数声明,需存储该函数,并将指向该函数的引用赋给表达式左边的变量

结论:函数声明与函数表达式的区别

函数声明函数表达式
1函数声明是完整的语句函数表达式只是语句的一部分
2函数命名时,创建一个与函数同名的变量,并让它指向函数函数命名时,通常不给函数指定名称,因此需要在代码中将函数赋给一个变量,或以其他方式使用函数表达式
3可以出现在代码的任何地方,函数声明创建的函数都是自己定义的,这被称为提升(hoisting)函数表达式创建的函数要等到它执行后才被定义
4函数将在执行代码前创建,即使未调用,也占用内存空间函数将在运行阶段执行代码时临时创建,调用完,立即释放,所以更节省内存空间

讲了这么多,相信你对函数声明与函数表达式已经有了一定的了解,来做个题目试试水吧~

阅读以下代码,从上到下依次说出执行结果:

// 从上到下依次说出执行结果
var foo = function () {console.log("foo1")
}
foo()var foo = function () {console.log("foo2")
}
foo()function foo() {console.log("foo1")
}
foo()function foo() {console.log("foo2")
}
foo()

具体答案,见下篇文章解答吧~

引用文章:

一个例子讲清楚函数声明和函数表达式 - 知乎

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/179598.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

使用opencv将sRGB格式的图片转换为DCI-P3格式【sRGB】【DCI-P3】

要将图像从 sRGB 格式转换为 DCI-P3 格式&#xff0c;您需要使用适当的线性转换矩阵。在 OpenCV 中&#xff0c;这通常涉及使用色彩转换函数&#xff0c;但 OpenCV 默认情况下不直接支持 sRGB 到 DCI-P3 的转换。因此&#xff0c;您需要手动计算并应用转换矩阵。 转换矩阵取决…

解决OpenAI unable to load history chatgpt

解决过程 打开浏览器控制台&#xff0c;发现有报错--unable to load history no access token when trying to use authheader&#xff0c;再慢慢检查&#xff0c;发现openAI session返回有 {"detail":"Too many requests in 1 hour. Try again later."}…

skywalking告警qq邮箱发送

首先开启发送接收qq邮箱的权限 开启之后&#xff0c;会让你发送信息&#xff0c;按着一系列操作&#xff0c;获得password &#xff08;授权码&#xff08;例如&#xff0c;qq开启SMTP授权码&#xff0c;qq授权码16位&#xff09;&#xff09; <!-- mail邮箱-->…

传智杯-题目1

运气 一&#xff1a;对于每一的1到6都进行枚举&#xff0c;进行递归操作 二&#xff1a;如果位数到了指定的n的时候&#xff0c;递归的条件&#xff0c;进行判断是否可以整除操作 #include<iostream> #include<algorithm> using namespace std; long long n, k, an…

Java抽象类:类的幕后黑手,提供继承和扩展的框架。

&#x1f451;专栏内容&#xff1a;Java⛪个人主页&#xff1a;子夜的星的主页&#x1f495;座右铭&#xff1a;前路未远&#xff0c;步履不停 目录 一、抽象类的概念二、注意事项三、抽象类的作用 一、抽象类的概念 在面向对象的概念中&#xff0c;所有的对象都是通过类来描绘…

Android 12.0 禁用adb reboot recovery命令实现正常重启功能

1.前言 在12.0的系统rom定制化开发中,在定制recovery模块的时候,由于产品开发需要要求禁用recovery的相关功能,比如在通过adb命令的 adb reboot recovery的方式进入recovery也需要实现禁用,所以就需要了解相关进入recovery流程来禁用该功能 2.禁用adb reboot recovery命令…

awk,sed都可以用号表示查找结果,给查找结果加括号反引号

给命令选项加上反引号 awk --help | awk { gsub(/\-{1,2}[A-Za-z\-]/,"&"); print $0 }[rootfedora ~]# awk --help | awk { gsub(/\-{1,2}[A-Za-z\-]/,"&"); print $0 } 用法&#xff1a;awk [POSIX 或 GNU 风格选项] -f 脚本文件 [--] 文件 ...…

vue3 element plus 表单验证 数组嵌套对象格式验证 动态验证等

基本结构 model 表单数据对象 rules 验证对象 prop model 的键名 <template><el-form ref"ruleFormRef" :model"ruleForm" :rules"rules"><el-form-item label"手机号" prop"mobile"><el-input v-mod…

鸿蒙原生应用/元服务开发-AGC分发如何生成密钥和和证书请求文件

HarmonyOS通过数字证书&#xff08;.cer文件&#xff09;和Profile文件&#xff08;.p7b文件&#xff09;等签名信息来保证应用的完整性&#xff0c;应用如需上架到华为应用市场必须通过签名校验。因此&#xff0c;开发者需要使用发布证书和Profile文件对应用进行签名后才能发布…

互联网程序设计HTML+CSS+JS

一、HTML基础 HTML超文本标记语言。 超文本&#xff1a;链接&#xff1b; 标记&#xff1a;标签&#xff0c;带尖括号的文本。 1、标签结构 标签要成对出现&#xff0c;中间包裹内容&#xff1b; <>里面放英文字母&#xff08;标签名&#xff09;&#xff1b; 结束…

在centos7上源码安装nginx

1. 安装必要的编译工具和依赖项 在编译Nginx之前&#xff0c;你需要安装一些编译工具和依赖项。可以通过以下命令安装&#xff1a; yum install gcc-c pcre-devel zlib-devel make 2. 下载Nginx源代码 从Nginx官网下载最新的源代码。你可以使用wget命令来下载&#xff1a; …

vue项目中实现doc/excel/pdf/图片等文件的预览

vue项目中实现doc/excel/pdf/图片等文件的预览 word预览 1. 使用vue-office-docx&#xff08;只支持docx文件预览&#xff0c;不支持doc文件&#xff09; 支持文档网络地址&#xff08;https://***.docx&#xff09;。 文件上传时预览&#xff0c;此时可以获取文件的ArrayBuf…

Python压缩、解压文件

#!/usr/bin/python3 # -*- coding:utf-8 -*- """ author: JHC file: util_compress.py time: 2023/5/28 14:58 desc: rarfile 使用需要安装 rarfile 和 unrar 并且将 unrar.exe 复制到venv/Scrpits目录下 """ import os import gzip from zipfil…

<Linux>(极简关键、省时省力)《Linux操作系统原理分析之Linux 进程管理 7》(11)

《Linux操作系统原理分析之Linux 进程管理 7》&#xff08;11&#xff09; 4 Linux 进程管理4.7 IPC 信号量机制4.7.1 信号量与信号量集合1.信号量2.信号量集合3.信号量集合的集中 4.7.2 信号量集合的创建和检索4.7.3 信号量 PV 操作4.7.4 信号量操作等待队列1.信号量操作等待队…

整数反转 Golang leecode_7

拿到手第一反应还是暴力&#xff0c;直接从低位到高位把数一个个取出来&#xff0c;然后乘以每一位的权重&#xff0c;构成一个新的反转后的整数 res 返回&#xff0c;代码如下 package mainimport ("fmt""math" )func reverse(x int) int {if x > -10…

Java 基础学习(三)循环流程控制与数组

1 循环流程控制 1.1 循环流程控制概述 1.1.1 什么是循环流程控制 当一个业务过程需要多次重复执行一个程序单元时&#xff0c;可以使用循环流程控制实现。 Java中包含3种循环结构&#xff1a; 1.2 for循环 1.2.1 for循环基础语法 for循环是最常用的循环流程控制&#xff…

redis运维(二十二)redis 的扩展应用 lua(四)

一 最佳实践 ① 铺垫 最佳实践&#xff1a;1、把redis操作所需的key通过KEYS进行参数传递2、其它的lua脚本所需的参数通过ARGV进行传递. redis lua脚本原理 Redis Lua脚本的执行原理 ② 删除指定的脚本缓存 ③ redis集群模式下使用lua脚本注意事项 1、常见报错现象 C…

SpringBoot 项目中获取 Request 的四种方法

SpringBoot 项目中获取 Request 的四种方法 方法1、Controller中加参数来获取request 注意&#xff1a;只能在Controller中加入request参数。 一般&#xff0c;我们在Controller中加参数获取HttpServletRequest&#xff0c;如下所示&#xff1a; RestController RequestMap…

『 Linux 』进程优先级

文章目录 什么是优先级Linux下的进程优先级PRI与NI使用top查看进程以及对进程的优先级的修改 进程优先级的其他概念竞争性与独立性并发与并行 什么是优先级 优先级,顾名思义,即在同一环境下不同单位对同一个资源的享有顺序; 一般优先级高的单位将优先占有该资源; 在进程当中进…

Python中如何用栈实现队列

目录 一、引言 二、使用两个栈实现队列 三、性能分析 四、应用场景 五、代码示例 六、优缺点总结 一、引言 队列&#xff08;Queue&#xff09;和栈&#xff08;Stack&#xff09;是计算机科学中常用的数据结构。队列是一种特殊的线性表&#xff0c;只允许在表的前端进行…