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

【JavaScript函数详解】Day04

news 2025/9/12 11:09:17

JavaScript函数详解

  • JavaScript 基础 - 第4天笔记
    • 函数
      • 声明和调用
        • 声明（定义）
        • 调用
      • 参数
        • 形参和实参
        • 参数默认值
      • 返回值
      • 函数补充细节
      • 作用域
        • 全局作用域
        • 局部作用域
        • 变量的访问原则
      • 匿名函数
        • 函数表达式
        • 立即执行函数
      • 逻辑中断
      • 小知识（转换为Boolean型）

JavaScript 基础 - 第4天笔记

理解封装的意义，能够通过函数的声明实现逻辑的封装，知道对象数据类型的特征，结合数学对象实现简单计算功能。

  • 理解函数的封装的特征
  • 掌握函数声明的语法
  • 理解什么是函数的返回值
  • 知道并能使用常见的内置函数

函数

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

声明和调用

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

比如我们前面使用的 alert() 、 prompt() 和 console.log() 都是一些 js 函数，只不过已经封装好了，我们直接使用的。

声明（定义）

声明（定义）一个完整函数包括关键字、函数名、形式参数、函数体、返回值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>

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

小案例： 小星星

<script>// 函数声明function sayHi() {// document.write('hai~')document.write(`*<br>`)document.write(`**<br>`)document.write(`***<br>`)document.write(`****<br>`)document.write(`*****<br>`)document.write(`******<br>`)document.write(`*******<br>`)document.write(`********<br>`)document.write(`*********<br>`)}// 函数调用sayHi()sayHi()sayHi()sayHi()sayHi()</script>

参数

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

在这里插入图片描述

<!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. 调用函数传递的实参要与形参的顺序一致
形参和实参

在这里插入图片描述

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

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

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

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

我们曾经使用过的 alert(‘打印’), parseInt(‘11’), Number(‘11’) 本质上都是函数调用的传参

<!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>
参数默认值

在这里插入图片描述

返回值

函数的本质是封装（包裹），函数体内的逻辑执行完毕后，函数外部如何获得函数内部的执行结果呢？要想获得函数内部逻辑的执行结果，需要通过 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

函数补充细节

  • 两个相同的函数后面的会覆盖前面的函数

  • 在Javascript中 实参的个数和形参的个数可以不一致

    • 如果形参过多 会自动填上undefined (了解即可)
    • 如果实参过多 那么多余的实参会被忽略 (函数内部有一个arguments,里面装着所有的实参)

  • 函数一旦碰到return就不会在往下执行了 函数的结束用return

思考：break的结束和return结束有什么区别

break结束的是循环或者switch，return结束的是函数。

作用域

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

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

全局作用域

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

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

局部作用域

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

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

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

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

变量的访问原则

  • 只要是代码，就至少有一个作用域

  • 写在函数内部的局部作用域

  • 如果函数中还有函数，那么在这个作用域中就又可以诞生一个作用域

  • 访问原则：在能够访问到的情况下 先局部， 局部没有在找全局

总结：

变量访问原则是采取就近原则的方式来查找变量最终的值

匿名函数

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

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

使用方式：

  • 函数表达式

  • 立即执行函数

函数表达式

在这里插入图片描述

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

在这里插入图片描述

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

逻辑中断

在这里插入图片描述


在这里插入图片描述

小知识（转换为Boolean型）

显示转换：

Boolean(内容)

记忆： ‘’ 、0、undefined、null、false、NaN 转换为布尔值后都是false, 其余则为 true


隐式转换：

  1. 有字符串的加法 “” + 1 ，结果是 “1”

  2. 减法 - （像大多数数学运算一样）只能用于数字，它会使空字符串 “” 转换为 0

  3. null 经过数字转换之后会变为 0

  4. undefined 经过数字转换之后会变为 NaN

在这里插入图片描述

相关文章：

【JavaScript函数详解】Day04

JavaScript函数详解 JavaScript 基础 - 第4天笔记函数声明和调用声明&#xff08;定义&#xff09;调用 参数形参和实参参数默认值 返回值函数补充细节作用域全局作用域局部作用域变量的访问原则 匿名函数函数表达式立即执行函数 逻辑中断小知识&#xff08;转换为Boolean型&am…...

编程日记 2024/6/9 12:15:17

json和axion结合

目录 java中使用JSON对象 在pom.xml中导入依赖 使用 public static String toJSONString(Object object)把自定义对象变成JSON对象 json和axios综合案例 使用的过滤器 前端代码 响应和请求都是普通字符串 和 请求时普通字符串&#xff0c;响应是json字符串 响应的数据是…...

编程日记 2024/6/9 12:14:16

v1.2.70-FastJson的AutoType机制研究

v1.2.70-FastJson的AutoType机制研究 最近在对接Alexa亚马逊语音技能&#xff0c;Smart Home Skill Apis时&#xff0c;有一个配置的JSON字符串是这样的&#xff1a; { "capabilityResources": {"friendlyNames": [{"type": "asset",…...

编程日记 2024/6/9 12:11:13

老旧机子装linux——Xubuntu

目录 前言 正文 下载系统 ​编辑 制作系统盘&#xff1a; 安装界面 Xubuntu ​编辑 lubuntu 后语 前言 有两台电脑&#xff0c;一台装了Ubuntu22&#xff0c;一台装了debuntu。虽然debuntu界面与乌班图大体一样&#xff0c;但是编译器好像有点区别。由于机子为10年前的老…...

编程日记 2024/6/9 12:09:11

关于Redis中事务

事务的四个特性 Redis到底有没有原子性 Redis中的原子性不同于MySQL&#xff0c;相比于MySQL&#xff0c;Redis中的原子性几乎不值一提。 MySQL中的原子性&#xff0c;不仅仅是“要么全都执行&#xff0c;要么全都不执行”&#xff0c;它还保证了“一旦执行&#xff0c;结果…...

编程日记 2024/6/9 12:06:08

【数据分享】《中国文化文物与旅游统计年鉴》2022

最近老有同学过来询问《中国旅游年鉴》、《中国文化文物统计年鉴》、《中国文化和旅游统计年鉴》、《中国文化文物与旅游统计年鉴》&#xff0c;这四本年年鉴的关系以及怎么获取这四本年鉴。今天就在这里给大家分享一下这四本年鉴的具体情况。 实际上2018年&#xff0c;为适应…...

编程日记 2024/6/9 12:05:06

设计模式及其在软件开发中的应用

一、技术难点 设计模式在软件开发中扮演着至关重要的角色&#xff0c;但它们的应用也伴随着一系列技术难点。 模式选择与识别&#xff1a;在实际项目中&#xff0c;正确识别和选择合适的设计模式是一个挑战。不同的设计模式适用于不同的场景&#xff0c;错误的选择可能导致系统…...

编程日记 2024/6/9 12:04:05

LeetCode72编辑距离

题目描述 解析 一般这种给出两个字符串的动态规划问题都是维护一个二维数组&#xff0c;尺寸和这两个字符串的长度相等&#xff0c;用二维做完了后可以尝试优化空间。这一题其实挺类似1143这题的&#xff0c;只不过相比1143的一种方式&#xff0c;变成了三种方式&#xff0c;就…...

编程日记 2024/6/9 12:03:04

竞拍商城系统源码后端PHP+前端UNIAPP

下载地址&#xff1a;竞拍商城系统源码后端PHP前端UNIAPP...

编程日记 2024/6/9 12:01:03

千益畅行，共享旅游卡，灵活同行，畅游无忧的全方位解析

千益畅行&#xff0c;共享旅游卡&#xff0c;满足您多样化的同行出行需求 近期&#xff0c;关于千益畅行共享旅游卡的咨询热度不减&#xff0c;尤其是关于其同行人数的限制问题。为了给大家一个清晰的解答&#xff0c;我们深入探讨了该旅游卡的特点和优势。 千益畅行共享旅游…...

编程日记 2024/6/9 11:59:01

Web IDE 在线编辑器综合实践（Web IDE 技术探索 三）

前言 前面两篇文章&#xff0c;我们简单讲述了 WebContainer/api 、Terminal 的基本使用&#xff0c;离完备的在线代码编辑器就差一个代码编辑了。今天通过 monaco editor &#xff0c;来实现初级代码编辑功能&#xff0c;讲述的是整个应用的搭建&#xff0c;并不单独针对monac…...

编程日记 2024/6/9 11:58:00

Less is more VS 精一 [生活感悟]

"Less is More”和王阳明的“精一”思想确实有相似之处。 王阳明的“精一”思想强调的是专注于一件事&#xff0c;将其做到极致&#xff0c;这与"Less is More”中提倡的通过减少数量来提高质量的理念不谋而合。两者都强调了专注和深度的重要性&#xff0c;而不是追…...

编程日记 2024/6/9 11:56:59

函数的概念及图像

注&#xff1a; 判断两函数是否相同&#xff0c;只看定义域和对应法则。 1. 函数的定义 一般的&#xff0c;在一个变化过程中有两个变量 x&#xff0c;y。如果对于x在某个变化范围内的每一个确定值&#xff0c;按照某个对应法则&#xff0c;都有唯一确定的值y和他对应。那么y就…...

编程日记 2024/6/9 11:54:56

Linux中Apache网站基于Http服务的访问限制(基于地址/用户)

&#x1f3e1;作者主页&#xff1a;点击&#xff01; &#x1f468;‍&#x1f4bb;Linux高级管理专栏&#xff1a;点击&#xff01; ⏰️创作时间&#xff1a;2024年6月3日11点44分 &#x1f004;️文章质量&#xff1a;95分 为了更好地控制对网站资源的访问&#xff0c;可…...

编程日记 2024/6/9 11:53:55

滚动条详解：跨平台iOS、Android、小程序滚动条隐藏及自定义样式综合指南

滚动条是用户界面中的图形化组件&#xff0c;用于指示和控制内容区域的可滚动范围。当元素内容超出其视窗边界时&#xff0c;滚动条提供可视化线索&#xff0c;并允许用户通过鼠标滚轮、触屏滑动或直接拖动滑块来浏览未显示部分&#xff0c;实现内容的上下或左右滚动。它在保持…...

编程日记 2024/6/9 11:51:53

06 Linux 设备驱动模型

1、Overview Linux-2.6 引入的新的设备管理机制 - kobject 降低设备多样性带来的 Linux 驱动开发的复杂度，以及设备热拔插处理、电源管理等将硬件设备归纳、分类，然后抽象出一套标准的数据结构和接口驱动的开发，就简化为对内核所规定的数据结构的填充和实现驱动模型是 Linu…...

编程日记 2024/6/9 11:50:52

检测五个数是否一样的算法

目录 算法算法的输出与打印效果输出输入1输入2 打印打印1打印2 算法的流程图总结 算法 int main() {int arr[5] { 0 };int i 0;int ia 0;for (i 0; i < 5; i) { scanf("%d", &arr[i]); }for (i 1; i < 5; i) {if (arr[0] ! arr[i]) {ia 1;break;} }…...

编程日记 2024/6/9 11:49:50

java 原生http服务器 测试JS前端ajax访问实现跨域传post数据

后端 java eclipse 字节流转字符 package Httpv3;import com.sun.net.httpserver.Headers; import com.sun.net.httpserver.HttpExchange; import com.sun.net.httpserver.HttpHandler; import com.sun.net.httpserver.HttpServer;import java.io.IOException; import java.i…...

编程日记 2024/6/9 11:46:46

【机器学习】消息传递神经网络(MPNN)在分子预测领域的医学应用

1. 引言 1.1. 分子性质预测概述 分子性质预测是计算机辅助药物发现流程中至关重要的任务之一&#xff0c;它在许多下游应用如药物筛选和药物设计中发挥着核心作用&#xff1a; 1.1.1. 目的与重要性&#xff1a; 分子性质预测旨在通过分子内部信息&#xff08;如原子坐标、原…...

编程日记 2024/6/9 11:45:45

Python Flask实现蓝图Blueprint配置和模块渲染

Python基础学习&#xff1a; Pyhton 语法基础Python 变量Python控制流Python 函数与类Python Exception处理Python 文件操作Python 日期与时间Python Socket的使用Python 模块Python 魔法方法与属性 Flask基础学习&#xff1a; Python中如何选择Web开发框架&#xff1f;Pyth…...

编程日记 2024/6/9 11:43:43

【力扣数据库知识手册笔记】索引

索引 索引的优缺点 优点1. 通过创建唯一性索引&#xff0c;可以保证数据库表中每一行数据的唯一性。2. 可以加快数据的检索速度&#xff08;创建索引的主要原因&#xff09;。3. 可以加速表和表之间的连接&#xff0c;实现数据的参考完整性。4. 可以在查询过程中&#xff0c;…...

编程新知 2025/9/9 10:11:34

JUC笔记(上)-复习 涉及死锁 volatile synchronized CAS 原子操作

一、上下文切换 即使单核CPU也可以进行多线程执行代码&#xff0c;CPU会给每个线程分配CPU时间片来实现这个机制。时间片非常短&#xff0c;所以CPU会不断地切换线程执行&#xff0c;从而让我们感觉多个线程是同时执行的。时间片一般是十几毫秒(ms)。通过时间片分配算法执行。…...

编程新知 2025/8/22 3:28:52

精益数据分析（97/126）：邮件营销与用户参与度的关键指标优化指南

精益数据分析&#xff08;97/126&#xff09;&#xff1a;邮件营销与用户参与度的关键指标优化指南 在数字化营销时代&#xff0c;邮件列表效度、用户参与度和网站性能等指标往往决定着创业公司的增长成败。今天&#xff0c;我们将深入解析邮件打开率、网站可用性、页面参与时…...

编程新知 2025/6/25 2:48:04

2025季度云服务器排行榜

在全球云服务器市场&#xff0c;各厂商的排名和地位并非一成不变&#xff0c;而是由其独特的优势、战略布局和市场适应性共同决定的。以下是根据2025年市场趋势&#xff0c;对主要云服务器厂商在排行榜中占据重要位置的原因和优势进行深度分析&#xff1a; 一、全球“三巨头”…...

编程新知 2025/9/2 22:30:49

回溯算法学习

一、电话号码的字母组合 import java.util.ArrayList; import java.util.List;import javax.management.loading.PrivateClassLoader;public class letterCombinations {private static final String[] KEYPAD {"", //0"", //1"abc", //2"…...

编程新知 2025/9/4 2:30:13

LangChain知识库管理后端接口：数据库操作详解—— 构建本地知识库系统的基础《二》

这段 Python 代码是一个完整的 知识库数据库操作模块&#xff0c;用于对本地知识库系统中的知识库进行增删改查&#xff08;CRUD&#xff09;操作。它基于 SQLAlchemy ORM 框架 和一个自定义的装饰器 with_session 实现数据库会话管理。 &#x1f4d8; 一、整体功能概述 该模块…...

编程新知 2025/8/28 18:38:08

MySQL 主从同步异常处理

阅读原文&#xff1a;https://www.xiaozaoshu.top/articles/mysql-m-s-update-pk MySQL 做双主&#xff0c;遇到的这个错误&#xff1a; Could not execute Update_rows event on table ... Error_code: 1032是 MySQL 主从复制时的经典错误之一&#xff0c;通常表示&#xff…...

编程新知 2025/8/4 1:00:56

[拓扑优化] 1.概述

常见的拓扑优化方法有&#xff1a;均匀化法、变密度法、渐进结构优化法、水平集法、移动可变形组件法等。 常见的数值计算方法有&#xff1a;有限元法、有限差分法、边界元法、离散元法、无网格法、扩展有限元法、等几何分析等。 将上述数值计算方法与拓扑优化方法结合&#…...

编程新知 2025/9/6 13:54:05

python基础语法Ⅰ

python基础语法Ⅰ 常量和表达式变量是什么变量的语法1.定义变量使用变量 变量的类型1.整数2.浮点数(小数)3.字符串4.布尔5.其他 动态类型特征注释注释是什么注释的语法1.行注释2.文档字符串 注释的规范 常量和表达式 我们可以把python当作一个计算器&#xff0c;来进行一些算术…...

编程新知 2025/9/11 10:48:07

AWS vs 阿里云：功能、服务与性能对比指南

在云计算领域&#xff0c;Amazon Web Services (AWS) 和阿里云 (Alibaba Cloud) 是全球领先的提供商&#xff0c;各自在功能范围、服务生态系统、性能表现和适用场景上具有独特优势。基于提供的引用[1]-[5]&#xff0c;我将从功能、服务和性能三个方面进行结构化对比分析&#…...

编程新知 2025/7/19 7:03:40