当前位置： 首页 > news >正文

JavaScript 基础学习笔记（五）：函数、作用域、匿名函数

news 2026/2/9 5:02:40

目录

一、函数

1.1 声明和调用

1.2 形参和实参

1.3 返回值

二、作用域

2.1 全局作用域

2.2 局部作用域

三、匿名函数

3.1 函数表达式

3.2 立即执行函数

一、函数

理解函数的封装特性，掌握函数的语法规则

1.1 声明和调用

函数可以把具有相同或相似逻辑的代码“包裹”起来，通过函数调用执行这些被“包裹”的代码逻辑，这么做的优势是有利于精简代码方便复用。

声明（定义）一个完整函数包括关键字、函数名、形式参数、函数体、返回值5个部分

调用

声明（定义）的函数必须调用才会真正被执行，使用 () 调用函数。

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>JavaScript 基础 - 声明和调用</title>
</head>
<body><script>// 声明（定义）了最简单的函数，既没有形式参数，也没有返回值function sayHi() {console.log('嗨~')}// 函数调用，这些函数体内的代码逻辑会被执行// 函数名()sayHi()// 可以重复被调用，多少次都可以sayHi()</script>
</body>
</html>

参数

通过向函数传递参数，可以让函数更加灵活多变，参数可以理解成是一个变量。

声明（定义）一个功能为打招呼的函数

  • 传入数据列表

  • 声明这个函数需要传入几个数据

  • 多个数据用逗号隔开

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>JavaScript 基础 - 函数参数</title>
</head>
<body><script>// 声明（定义）一个功能为打招呼的函数// function sayHi() {//   console.log('嗨~')// }// 调用函数// sayHi()// 这个函数似乎没有什么价值，除非能够向不同的人打招呼// 这就需要借助参数来实现了function sayHi(name) {// 参数 name 可以被理解成是一个变量console.log(name)console.log('嗨~' + name)}// 调用 sayHi 函数，括号中多了 '小明'// 这时相当于为参数 name 赋值了sayHi('小明')// 结果为 小明// 再次调用 sayHi 函数，括号中多了 '小红'// 这时相当于为参数 name 赋值了sayHi('小红') // 结果为 小红</script>
</body>
</html>

总结：

  1. 声明（定义）函数时的形参没有数量限制，当有多个形参时使用 , 分隔

  2. 调用函数传递的实参要与形参的顺序一致

1.2 形参和实参

形参：声明函数时写在函数名右边小括号里的叫形参（形式上的参数）

实参：调用函数时写在函数名右边小括号里的叫实参（实际上的参数）

形参可以理解为是在这个函数内声明的变量（比如 num1 = 10）实参可以理解为是给这个变量赋值

开发中尽量保持形参和实参个数一致

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>JavaScript 基础 - 函数参数</title>
</head>
<body><script>// 声明（定义）一个计算任意两数字和的函数// 形参 x 和 y 分别表示任意两个数字，它们是两个变量function count(x, y) {console.log(x + y);}// 调用函数，传入两个具体的数字做为实参// 此时 10 赋值给了形参 x// 此时 5  赋值给了形参 ycount(10, 5); // 结果为 15</script>
</body>
</html>

1.3 返回值

函数的本质是封装（包裹），函数体内的逻辑执行完毕后，函数外部如何获得函数内部的执行结果呢？要想获得函数内部逻辑的执行结果，需要通过 return 这个关键字，将内部执行结果传递到函数外部，这个被传递到外部的结果就是返回值。

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>JavaScript 基础 - 函数返回值</title>
</head>
<body><script>// 定义求和函数function count(a, b) {let s = a + b// s 即为 a + b 的结果// 通过 return 将 s 传递到外部return s}// 调用函数，如果一个函数有返回值// 那么可将这个返回值赋值给外部的任意变量let total = count(5, 12)</script>
</body>
</html>

总结：

  1. 在函数体中使用return 关键字能将内部的执行结果交给函数外部使用

  2. 函数内部只能出现1 次 return，并且 return 下一行代码不会再被执行，所以return 后面的数据不要换行写

  3. return会立即结束当前函数

  4. 函数可以没有return，这种情况默认返回值为 undefined

二、作用域

通常来说，一段程序代码中所用到的名字并不总是有效和可用的，而限定这个名字的可用性的代码范围就是这个名字的作用域。

作用域的使用提高了程序逻辑的局部性，增强了程序的可靠性，减少了名字冲突。

2.1 全局作用域

作用于所有代码执行的环境(整个 script 标签内部)或者一个独立的 js 文件

处于全局作用域内的变量，称为全局变量

2.2 局部作用域

作用于函数内的代码环境，就是局部作用域。 因为跟函数有关系，所以也称为函数作用域。

处于局部作用域内的变量称为局部变量

如果函数内部，变量没有声明，直接赋值，也当全局变量看，但是强烈不推荐

但是有一种情况，函数内部的形参可以看做是局部变量。

三、匿名函数

函数可以分为具名函数和匿名函数

匿名函数：没有名字的函数,无法直接使用。

3.1 函数表达式

// 声明
let fn = function() { console.log('函数表达式')
}
// 调用
fn()

3.2 立即执行函数

(function(){ xxx  })();
(function(){xxxx}());

无需调用，立即执行，其实本质已经调用了

多个立即执行函数之间用分号隔开

相关文章：

JavaScript 基础学习笔记（五）：函数、作用域、匿名函数

目录 一、函数 1.1 声明和调用 1.2 形参和实参 1.3 返回值 二、作用域 2.1 全局作用域 2.2 局部作用域 三、匿名函数 3.1 函数表达式 3.2 立即执行函数 一、函数 理解函数的封装特性&#xff0c;掌握函数的语法规则 1.1 声明和调用 函数可以把具有相同或相似逻辑的代…...

编程日记 2024/2/29 14:00:50

Qt环境配置VTK

Qt与VTK的结合为开发者提供了强大的跨平台图形界面开发能力和三维可视化处理能力。本教程旨在详细介绍如何配置Qt环境以使用VTK库&#xff0c;从而为开发者打造高效、强大的三维可视化应用。 一、准备工作 在开始之前&#xff0c;确保您的开发环境中已经安装了Qt和CMake。Qt提…...

编程日记 2024/2/29 13:59:49

腾讯云最新活动_腾讯云促销优惠_代金券-腾讯云官网入口

腾讯云服务器多少钱一年&#xff1f;62元一年起&#xff0c;2核2G3M配置&#xff0c;腾讯云2核4G5M轻量应用服务器218元一年、756元3年&#xff0c;4核16G12M服务器32元1个月、312元一年&#xff0c;8核32G22M服务器115元1个月、345元3个月&#xff0c;腾讯云服务器网txyfwq.co…...

编程日记 2024/2/29 13:58:48

如何创建自己的Spring Boot Starter并为其编写单元测试

当我们想要封装一些自定义功能给别人使用的时候&#xff0c;创建Spring Boot Starter的形式是最好的实现方式。如果您还不会构建自己的Spring Boot Starter的话&#xff0c;本文将带你一起创建一个自己的Spring Boot Starter。 快速入门 创建一个新的 Maven 项目。第三方封装的…...

编程日记 2024/2/29 13:57:47

数据分析---常见处理逻辑

目录 数据清洗数据转换数据聚合数据筛选增删改查（以查为例）数据清洗 去除重复值：使用DISTINCT关键字去除重复行。//这将返回一个包含所有不重复城市的结果集 SELECT DISTINCT city FROM students;处理缺失值：使用IS NULL或IS NOT NULL判断是否为空值，并使用COALESCE或CASE…...

编程日记 2024/2/29 13:54:43

2024-02-26（金融AI行业概览与大数据生态圈）

1.最开始的风控是怎么做的&#xff1f; 人审 吃业务经验 不能大批量处理&#xff0c;效率低下 不适用于移动互联网的金融场景 2.建模的概念 建模就是构造一个数学公式&#xff0c;能将我们手上有的数据输入进去&#xff0c;通过计算得到一些预测结果。 比如初高中学习的…...

编程日记 2024/2/29 13:49:36

git忽略某些文件(夹)更改说明

概述 在项目中，常有需要忽略的文件、文件夹提交到代码仓库中，在此做个笔录。 一、在项目根目录内新建文本文件，并重命名为.gitignore，该文件语法如下 # 以#开始的行，被视为注释. # 忽略掉所有文件名是 a.txt的文件. a.txt # 忽略所有生成的 java文件, *.java # a.j…...

编程日记 2024/2/29 13:46:33

python爬虫实战：获取电子邮件和联系人信息

引言 在数字时代&#xff0c;电子邮件和联系人信息成为了许多企业和个人重要的资源&#xff0c;在本文中&#xff0c;我们将探讨如何使用Python爬虫从网页中提取电子邮件和联系人信息&#xff0c;并附上示例代码。 目录 引言 二、准备工作 你可以使用以下命令来安装这些库&a…...

编程日记 2024/2/29 13:44:31

post请求同时上传文件并传递其他参数的前后端写法

最近有一需求&#xff0c;post请求从前端上传一个文件同时传递一个参数&#xff0c;多次实验后记录下两种写法&#xff1a; 方法一&#xff1a; 前端&#xff1a;重点是设置请求头代码如下&#xff1a; getfile(event) {//input框输入文件let file event.target.files[0];l…...

编程日记 2024/2/29 13:41:28

【数仓】基本概念、知识普及、核心技术

一、数仓基本概念 数仓的定义&#xff1a; 数据仓库&#xff08;Data Warehouse&#xff0c;简称DW或DWH&#xff09;是一个面向主题的、集成的、相对稳定的、反映历史变化的数据集合&#xff0c;用于支持管理决策。简言之&#xff0c;它是一个大型存储库&#xff0c;用于存储来…...

编程日记 2024/2/29 13:40:27

ky10-server docker 离线安装包、离线安装

离线安装脚本 # ---------------离线安装docker------------------- rpm -Uvh --force --nodeps *.rpm# 修改docker拉取源为国内 rm -rf /etc/docker mkdir -p /etc/docker touch /etc/docker/daemon.json cat >/etc/docker/daemon.json<<EOF{"registry-mirro…...

编程日记 2024/2/29 13:37:23

Linux的gdb调试

文章目录 一、编译有调试信息的目标文件二、启动gdb调试文件1、查看内容list/l&#xff1a;l 文件名:行号/函数名&#xff0c;l 行号/函数名2、打断点b&#xff1a;b文件名:行号/函数名&#xff0c;b 行号/函数名 与 查看断点info/i&#xff1a;info b3、删除断点d&#xff1a;…...

编程日记 2024/2/29 13:36:22

IO多路复用-select模型

IO多路复用&#xff08;IO Multiplexing&#xff09;是一种高效的网络编程模型&#xff0c;可以同时监控多个文件描述符&#xff08;包括套接字等&#xff09;&#xff0c;并在有数据可读或可写时进行通知。其中&#xff0c;select模型是最常用和最早引入的一种IO多路复用模型。…...

编程日记 2024/2/29 13:34:20

班级事务管理系统设计与实现

** &#x1f345;点赞收藏关注 → 私信领取本源代码、数据库&#x1f345; 本人在Java毕业设计领域有多年的经验&#xff0c;陆续会更新更多优质的Java实战项目希望你能有所收获&#xff0c;少走一些弯路。&#x1f345;关注我不迷路&#x1f345;** 一 、设计说明 1.1 选题…...

编程日记 2024/2/29 13:32:18

金三银四面试必问：Redis真的是单线程吗？

文章目录 01 Redis中的多线程1&#xff09;redis-server&#xff1a;2&#xff09;jemalloc_bg_thd3&#xff09;bio_xxx&#xff1a; 02 I/O多线程03 Redis中的多进程04 结论▼延伸阅读 由面试题“Redis是否为单线程”引发的思考 作者&#xff1a;李乐 来源&#xff1a;IT阅读…...

编程日记 2024/2/29 13:31:16

notejs+nvm+angular+typescript.js环境 Hertzbeat 配置

D:\Program Files\nodejs\ D:\Users\Administrator\AppData\Roaming\nvm nvm命令提示 nvm arch&#xff1a;显示node是运行在32位还是64位。 nvm install <version> [arch] &#xff1a;安装node&#xff0c; version是特定版本也可以是最新稳定版本latest。 可选参…...

编程日记 2024/2/29 13:30:15

docker安装单机版canal和使用

说明&#xff1a;我安装的组件架构如下&#xff1a; 1、准备一台虚拟机&#xff0c;192.168.2.223&#xff0c;我安装的时候&#xff0c;docker只支持canal1.1.6版本&#xff0c;1.1.7无法使用docker安装.还有一点要补充&#xff0c;就是1.1.6好像不支持es8.0以上版本&#x…...

编程日记 2024/2/29 13:28:12

qt_xml文件

文章内容 简单介绍xml文件的增删改查写生成和读取xml文件的例子增删改查 Qt提供了QDomDocument类来操作XML文件。 增加节点： QDomElement root = doc.createElement("root"); doc.appendChild(root);QDomElement element = doc.createElement("element"…...

编程日记 2024/2/29 13:25:08

【DAY05 软考中级备考笔记】线性表，栈和队列，串数组矩阵和广义表

线性表&#xff0c;栈和队列&#xff0c;串数组矩阵和广义表 2月28日 – 天气&#xff1a;阴转晴 时隔好几天没有学习了&#xff0c;今天补上。明天发工资&#xff0c;开心&#x1f604; 1. 线性表 1.1 线性表的结构 首先线性表的结构分为物理结构和逻辑结构 物理结构按照实…...

编程日记 2024/2/29 13:23:06

AutoGen Studio助力打造私人GPTs

微软最近在开源项目里的确挺能整活儿啊！ 这次我介绍的是AutoGen Studio，我认为这个项目把AutoGen可用性又拔高了一个层次的项目 项目给自己的定义是交互式的多Agent workflow 项目地址：autogen/samples/apps/autogen-studio at main microsoft/autogen (github.com) 首先我…...

编程日记 2024/2/29 13:21:03

AI-调查研究-01-正念冥想有用吗？对健康的影响及科学指南

点一下关注吧&#xff01;&#xff01;&#xff01;非常感谢&#xff01;&#xff01;持续更新&#xff01;&#xff01;&#xff01; &#x1f680; AI篇持续更新中&#xff01;&#xff08;长期更新&#xff09; 目前2025年06月05日更新到&#xff1a; AI炼丹日志-28 - Aud…...

编程新知 2026/2/8 5:11:39

设计模式和设计原则回顾

设计模式和设计原则回顾 23种设计模式是设计原则的完美体现，设计原则设计原则是设计模式的理论基石， 设计模式 在经典的设计模式分类中（如《设计模式：可复用面向对象软件的基础》一书中），总共有23种设计模式，分为三大类： 一、创建型模式（5种） 1. 单例模式（Sing…...

编程新知 2025/12/14 20:57:41

CTF show Web 红包题第六弹

提示 1.不是SQL注入 2.需要找关键源码 思路 进入页面发现是一个登录框&#xff0c;很难让人不联想到SQL注入&#xff0c;但提示都说了不是SQL注入&#xff0c;所以就不往这方面想了 ​ 先查看一下网页源码&#xff0c;发现一段JavaScript代码&#xff0c;有一个关键类ctfs…...

编程新知 2026/2/5 4:33:58

云启出海，智联未来｜阿里云网络「企业出海」系列客户沙龙上海站圆满落地

借阿里云中企出海大会的东风&#xff0c;以**「云启出海&#xff0c;智联未来&#xff5c;打造安全可靠的出海云网络引擎」为主题的阿里云企业出海客户沙龙云网络&安全专场于5.28日下午在上海顺利举办&#xff0c;现场吸引了来自携程、小红书、米哈游、哔哩哔哩、波克城市、…...

编程新知 2026/1/30 0:00:28

React19源码系列之 事件插件系统

事件类别 事件类型 定义 文档 Event Event 接口表示在 EventTarget 上出现的事件。 Event - Web API | MDN UIEvent UIEvent 接口表示简单的用户界面事件。 UIEvent - Web API | MDN KeyboardEvent KeyboardEvent 对象描述了用户与键盘的交互。 KeyboardEvent - Web…...

编程新知 2026/2/7 8:31:55

Cloudflare 从 Nginx 到 Pingora：性能、效率与安全的全面升级

在互联网的快速发展中&#xff0c;高性能、高效率和高安全性的网络服务成为了各大互联网基础设施提供商的核心追求。Cloudflare 作为全球领先的互联网安全和基础设施公司&#xff0c;近期做出了一个重大技术决策&#xff1a;弃用长期使用的 Nginx&#xff0c;转而采用其内部开发…...

编程新知 2026/1/29 21:20:51

Java数值运算常见陷阱与规避方法

整数除法中的舍入问题 问题现象 当开发者预期进行浮点除法却误用整数除法时，会出现小数部分被截断的情况。典型错误模式如下： void process(int value) {double half = value / 2; // 整数除法导致截断// 使用half变量 }此时...

编程新知 2026/2/4 13:10:38

免费数学几何作图web平台

光锐软件免费数学工具&#xff0c;maths,数学制图&#xff0c;数学作图&#xff0c;几何作图&#xff0c;几何&#xff0c;AR开发,AR教育,增强现实,软件公司,XR,MR,VR,虚拟仿真,虚拟现实,混合现实,教育科技产品,职业模拟培训,高保真VR场景,结构互动课件,元宇宙http://xaglare.c…...

编程新知 2026/1/28 7:31:14

解决：Android studio 编译后报错\app\src\main\cpp\CMakeLists.txt‘ to exist

现象&#xff1a; android studio报错&#xff1a; [CXX1409] D:\GitLab\xxxxx\app.cxx\Debug\3f3w4y1i\arm64-v8a\android_gradle_build.json : expected buildFiles file ‘D:\GitLab\xxxxx\app\src\main\cpp\CMakeLists.txt’ to exist 解决&#xff1a; 不要动CMakeLists.…...

编程新知 2025/12/15 0:46:42

MacOS下Homebrew国内镜像加速指南（2025最新国内镜像加速）

macos brew国内镜像加速方法 brew install 加速formula.jws.json下载慢加速 &#x1f37a; 最新版brew安装慢到怀疑人生&#xff1f;别怕&#xff0c;教你轻松起飞&#xff01; 最近Homebrew更新至最新版&#xff0c;每次执行 brew 命令时都会自动从官方地址 https://formulae.…...

编程新知 2026/1/28 10:57:16