探索JavaScript函数---基础篇

目录

函数

声明和调用

声明（定义）

调用

参数

形参和实参

形参（Formal Arguments）

实参（Actual Arguments）

形参与实参的关系

返回值

作用域

全局作用域

局部作用域

匿名函数

函数表达式

立即执行函数

函数

一般来说，一个函数是可以通过外部代码调用的一个“子程序”（或在递归的情况下由内部函数调用）。像程序本身一样，一个函数由称为函数体的一系列语句组成。值可以传递给一个函数，函数将返回一个值。在 JavaScript 中，函数是头等 (first-class)对象，因为它们可以像任何其他对象一样具有属性和方法，可以像其他数据类型一样被赋值给变量、作为参数传递给其他函数，甚至作为其他函数的返回值。它们与其他对象的区别在于函数可以被调用。简而言之，它们是Function对象。                                                                                                                 ​​​​​​​                                                                ​​​​​​​——MDN 

声明和调用

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

声明（定义）

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

调用

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

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

注：函数名的命名规则与变量是一致的，并且尽量保证函数名的语义。

参数

参数是在函数名后的圆括号内定义的，多个参数之间用逗号分隔。

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

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

  • 传入数据列表

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

  • 多个数据用逗号隔开

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

总结：

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

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

形参和实参

形参（Formal Arguments）

形参是在定义函数时，在函数名后的括号内指定的占位符变量。它们代表函数期望接收的值，但并不实际包含值。形参的作用是告诉调用者这个函数需要哪些信息才能执行其任务。例如：


function addNumbers(a, b) {return a + b;
}

在这个例子中，a 和 b 是形参，它们代表了将来调用该函数时需要提供的两个数值。

实参（Actual Arguments）

实参是当函数被调用时，实际传递给函数的具体值。这些值用来替换函数定义中的形参。继续上面的例子，当我们调用 addNumbers 函数时，传递的值就是实参：

let result = addNumbers(5, 3);

这里，5 和 3 就是实参，它们分别对应并赋值给形参 a 和 b，函数执行后返回它们的和。

形参与实参的关系
  • 匹配：实参的数量和类型应当与函数定义中的形参相匹配。如果数量不匹配，JavaScript 在严格模式下会抛出错误；如果不使用严格模式，则可能会导致意外的行为或错误。
  • 传递方式：JavaScript 中，实参向形参的传递是基于值的传递。对于原始类型（如数字、字符串、布尔值），传递的是值的副本；而对于引用类型（如对象、数组），传递的是引用的副本，这意味着函数内部可以修改对象的属性或数组的内容，影响到外部。
  • 默认参数：ES6 引入了默认参数功能，允许在定义函数时为形参指定默认值。如果调用函数时没有提供对应的实参，就使用默认值。
function greet(name = "User") {console.log(`Hello, ${name}!`);
}greet(); // 输出 "Hello, User!"
greet("Alice"); // 输出 "Hello, Alice!"

eg：

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

返回值

return语句用于从函数中退出并返回一个值给调用者。如果函数体中没有return语句，或者return后面没有值，那么函数默认返回undefined。

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>函数返回值</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

作用域

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

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

全局作用域
  • 定义：在代码的最外层定义的变量或函数拥有全局作用域，这意味着它们在整个代码中任何地方都是可访问的。
  • 特点：全局变量会一直存在，直至页面关闭，可能导致内存泄漏。尽量避免非必要地使用全局变量，因为它们容易引起命名冲突。
let globalVar = "I'm global!";
function test() {console.log(globalVar); // 访问全局变量
}
test(); // 输出 "I'm global!"
局部作用域
  • 定义：在函数内部定义的变量拥有局部作用域，只能在该函数内部访问。
  • 特点：每次函数调用时都会创建新的局部作用域，变量在函数执行结束后会被销毁，有助于资源管理。
function test() {let localVar = "I'm local!";console.log(localVar); // 访问局部变量
}
test(); // 输出 "I'm local!"
console.log(localVar); // 错误，localVar在此不可访问

注意：

  • 如果函数内部，变量没有声明，直接赋值，也当全局变量看，但是强烈不推荐，这种行为经常导致意料之外的错误和全局变量的污染。
  • 函数的形参（形式参数）在函数定义时自动被视为局部变量。

匿名函数

匿名函数，顾名思义，是没有名字的函数。在JavaScript中，匿名函数是一种非常灵活且常用的特性，常用于需要一次性使用的简短函数逻辑场景，或是作为其他函数的参数传递给高阶函数。

函数表达式

函数表达式将函数定义赋值给一个变量、对象的属性或作为参数传递给其他函数。它可以是命名的也可以是匿名的。

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

函数表达式在赋值操作完成之前不能被调用，因为它们属于普通变量的赋值，遵循变量声明的规则。 

立即执行函数

立即执行函数（IIFE，Immediately Invoked Function Expression），即立即调用的函数表达式，也就是说，声明函数的同时立即调用这个函数。

(function(){ xxx  })();
(function(){xxxx}());//eg：
(function() {console.log("这是一个匿名函数，并且立即被执行了！");
})();

注意：

  • 无需调用，立即执行，其实本质已经调用了
  • 多个立即执行函数之间用分号隔开

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

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

相关文章

Linux权限提升二

Linux权限提升二

#应用场景&#xff1a; 获取到Web权限或普通用户在Linux服务器上时进行的SUID&SUDO提权 SUID (Set owner User ID up on execution)是给予文件的一个特殊类型的文件权限。在Linux/Unix中&#xff0c;当一个程序运行的时候&#xff0c;程序将从登录用户处继承权限。SUID被定…
阅读更多...
海康 面阵相机命名规则

海康 面阵相机命名规则

海康 面阵相机命名规则 https://www.v-club.com/vCollage/vCollageDetail/516?subjectIdRMse6nPiyo
阅读更多...
C语言牛客网题目--井字棋代码详解

C语言牛客网题目--井字棋代码详解

井字棋 KiKi和BoBo玩 “井”字棋。也就是在九宫格中&#xff0c;只要任意行、列&#xff0c;或者任意对角线上面出现三个连续相同的棋子&#xff0c;就能获胜。请根据棋盘状态&#xff0c;判断当前输赢。 输入描述&#xff1a; 三行三列的字符元素&#xff0c;代表棋盘状态&…
阅读更多...
【JS重点知识02】栈、堆与数据类型 关系

【JS重点知识02】栈、堆与数据类型 关系

一&#xff1a;栈堆空间分配区别&#xff1a; 1 栈&#xff1a;由操作系统自动分配释放存放函数的参数值、局部变量的值等。其操作方式类似于数据结构中的栈&#xff1b; 简单数据类型存放在栈中 2 堆&#xff1a;存储复杂数据类型&#xff08;对象&#xff09;&#xff0c;…
阅读更多...
【JMeter接口自动化】第3讲 Jmeter语言及外观配置

【JMeter接口自动化】第3讲 Jmeter语言及外观配置

Jmeter语言配置 方法一&#xff1a;暂时生效&#xff0c;下次打开JMeter还会恢复默认配置 Jmeter安装后&#xff0c;默认语言是英文&#xff0c;可以在“选项”——“选择语音”中更改 方法二&#xff0c;修改配置文件&#xff0c;永久生效 修改jmeter.properties文件 Jmete…
阅读更多...
【详细讲解版】史上最全transformer面试题

【详细讲解版】史上最全transformer面试题

史上最全transformer面试题答案 1.Transformer为何使用多头注意力机制&#xff1f;&#xff08;为什么不使用一个头&#xff09;2.Transformer为什么Q和K使用不同的权重矩阵生成&#xff0c;为何不能使用同一个值进行自身的点乘&#xff1f;3.Transformer计算attention的时候为…
阅读更多...
20240601在Toybrick的TB-RK3588开发板上跑IPC的SDK并确认eth0

20240601在Toybrick的TB-RK3588开发板上跑IPC的SDK并确认eth0

20240601在Toybrick的TB-RK3588开发板上跑IPC的SDK并确认eth0 2024/6/1 20:06 ADB的详细LOG&#xff1a; Microsoft Windows [版本 10.0.22621.3296] (c) Microsoft Corporation。保留所有权利。 C:\Users\QQ>adb shell adb server version (40) doesnt match this client …
阅读更多...
全国产飞腾模块麒麟信安操作系统安全漏洞

全国产飞腾模块麒麟信安操作系统安全漏洞

1、背景介绍 目前在全国产飞腾模块上部署了麒麟信安操作系统&#xff0c;经第三方机构检测存在以下漏洞 操作系统版本为 内核版本为 openssh版本为 2、openssh CBC模式漏洞解决 首先查看ssh加密信息 nmap --script "ssh2*" 127.0.0.1 | grep -i cbc 可以通过修改/…
阅读更多...
STL用法总结

STL用法总结

文章目录 vector构造常用函数遍历适用情形注意事项使用迭代器删除可能会出现的错误 Set & MultiSet&#xff08;不能用sort,会自动排序&#xff09;构造常用函数删除&#xff0c;查找遍历 unordered_set(不排序集合&#xff09;&#xff0c;unordered_multiset Map & M…
阅读更多...
spring boot 3.x版本 引入 swagger2启动时报错

spring boot 3.x版本 引入 swagger2启动时报错

一&#xff0c;问题 Spring Boot 3.x版本的项目里&#xff0c;准备引入Swagger2作为接口文档&#xff0c;但是项目启动报错&#xff1a; java.lang.TypeNotPresentException: Type javax.servlet.http.HttpServletRequest not present at java.base/sun.reflect.generics.…
阅读更多...
儿童节礼物-你能满足孩子们吗

儿童节礼物-你能满足孩子们吗

题目如下&#xff1a; 儿童节到了&#xff0c;幼儿园里有N个小朋友&#xff0c;每个小朋友都希望得到一份礼物。幼儿园的老师准备了M份不同的礼物&#xff0c;每份礼物都有一个编号&#xff0c;从1到M。老师希望每个小朋友都能得到一份礼物&#xff0c;但是每个小朋友对礼物的…
阅读更多...
Nginx(openresty) 开启gzip压缩功能 提高web网站传输速度

Nginx(openresty) 开启gzip压缩功能 提高web网站传输速度

1 开启nginx gzip压缩后&#xff0c;网页的图片&#xff0c;css、js等静态资源的大小会减少&#xff0c;节约带宽&#xff0c;提高传输效率&#xff0c;给用户快的体验,给用户更好的体验. 2 安装 #centos 8.5 yum install gzip 3 配置 #建议统一配置在http段 vim /usr/loca…
阅读更多...
Python语言云：探索Python在云计算领域的无限可能

Python语言云：探索Python在云计算领域的无限可能

Python语言云&#xff1a;探索Python在云计算领域的无限可能 随着云计算技术的迅猛发展&#xff0c;Python作为一种强大且易用的编程语言&#xff0c;在云计算领域展现出了其独特的魅力和无限可能。本文将从四个方面、五个方面、六个方面和七个方面&#xff0c;深入剖析Python…
阅读更多...
SleepFM：利用对比学习预训练的多模态“睡眠”基础模型

SleepFM：利用对比学习预训练的多模态“睡眠”基础模型

大模型技术论文不断&#xff0c;每个月总会新增上千篇。本专栏精选论文重点解读&#xff0c;主题还是围绕着行业实践和工程量产。若在阅读过程中有些知识点存在盲区&#xff0c;可以回到如何优雅的谈论大模型重新阅读。另外斯坦福2024人工智能报告解读为通识性读物。若对于如果…
阅读更多...
kaggle竞赛实战5

kaggle竞赛实战5

接下来将两套方案得结果做数据拼接 读数据 train_dict pd.read_csv(\ preprocess/train_dict.csv\ ) test_dict pd.read_csv(\ preprocess/test_dict.csv\ ) train_groupby pd.read_csv(\ preprocess/train_groupby.csv\ ) test_groupby pd.read_csv(\ …
阅读更多...
逻辑这回事（三）----功耗优化

逻辑这回事（三）----功耗优化

低功耗设计概述 低功耗设计动机 功耗的增加影响芯片Power grid(电源网格)的设计;功耗的增加导致芯片温度的上升，进而带来一系列影响。如Leakage Power增加;电路时序可能变差;IR Drop(IR压降)变大;功耗的增加导致芯片封装成本和散热成本的增加(packing cost、cooling cost)功耗…
阅读更多...
window本地域名映射修改

window本地域名映射修改

位置 C:\Windows\System32\drivers\etc 文件名 hosts 修改方法 复制一份到桌面 修改桌面的文件 # 前面为ip 后面为域名&#xff0c;域名-》ip的映射 127.0.0.1 link.com最后将修改后的文件保存&#xff0c;复制到C:\Windows\System32\drivers\etc替换
阅读更多...
Mysql 8.0.37 安装教程

Mysql 8.0.37 安装教程

图片有点长&#xff0c;慢慢来 安装教程 安装地址&#xff1a;MySQL :: MySQL Downloads 进入官网 下载社区版 此处有两个版本&#xff0c;我们下载的是8.0.37版本 第一个需要联网安装&#xff0c;我们现在第二个离线安装 server only&#xff1a;仅安装MySQL server clien…
阅读更多...
Java18+前端html+后端springboot一套可在线预约、在线下单的家政预约上门服务系统源码 家政系统（用户端）介绍

Java18+前端html+后端springboot一套可在线预约、在线下单的家政预约上门服务系统源码 家政系统（用户端）介绍

Java18前端html后端springboot一套可在线预约、在线下单的家政预约上门服务系统源码 家政系统&#xff08;用户端&#xff09;介绍 家政服务用户端是一个为家庭用户提供便捷、高效家政服务的应用程序。 以下是家政服务用户端的详细功能描述&#xff1a; 一、注册与登录&#…
阅读更多...
day46 完全背包理论基础 518. 零钱兑换 II 377. 组合总和 Ⅳ

day46 完全背包理论基础 518. 零钱兑换 II 377. 组合总和 Ⅳ

完全背包理论基础 有N件物品和一个最多能背重量为W的背包。第i件物品的重量是weight[i]&#xff0c;得到的价值是value[i] 。每件物品都有无限个&#xff08;也就是可以放入背包多次&#xff09;&#xff0c;求解将哪些物品装入背包里物品价值总和最大。 01背包内嵌的循环是从…
阅读更多...
最新文章

Copyright @ 2022~2023