ES6的默认参数和rest参数
✨ 专栏介绍
在现代Web开发中,JavaScript已经成为了不可或缺的一部分。它不仅可以为网页增加交互性和动态性,还可以在后端开发中使用Node.js构建高效的服务器端应用程序。作为一种灵活且易学的脚本语言,JavaScript具有广泛的应用场景,并且不断发展演进。在本专栏中,我们将深入学习JavaScript语言的基本语法、DOM操作、事件处理、异步编程以及常见算法和数据结构等内容。此外,我们还将介绍ES6及其后续版本中引入的新特性,如箭头函数、模块化、解构赋值等。通过学习这些内容,你将能够成为一名熟练的JavaScript开发者,并能够应用这些知识来构建出高质量和可维护的Web应用程序。让我们一起开始JavaScript之旅吧!
文章目录
- ✨ 专栏介绍
- 引言
- 一、默认参数
- 示例代码
- 使用示例
- 处理缺失或无效的输入
- 处理可选参数
- 二、rest参数
- 示例代码如下
- 使用示例
- 计算平均值
- 合并字符串
- 总结
- 😶 写在结尾
引言
ES6引入了默认参数和rest参数的特性,这些特性使得函数的定义和调用更加灵活和简洁。本文将详细介绍ES6默认参数和rest参数的作用、使用方式以及使用示例,并对其在不同场景下的应用进行总结。
一、默认参数
默认参数是指在函数定义时为参数提供默认值,当调用函数时没有传入对应的参数值时,将使用默认值。默认参数的作用是简化函数调用,避免因为缺少某些参数而导致错误。
使用方式 在ES6之前,为了实现默认参数,我们通常会在函数体内手动判断并赋予默认值。而在ES6中,我们可以直接在函数定义时为参数赋予默认值。
示例代码
function greet(name = 'World') {console.log(`Hello, ${name}!`);
}greet(); // 输出:Hello, World!
greet('Alice'); // 输出:Hello, Alice!
上述代码中,greet函数定义了一个名为name的默认参数,默认值为’World’。当调用greet函数时没有传入任何参数,则会使用默认值;当传入了具体的参数,则会使用传入的值。
使用示例
处理缺失或无效的输入
function calculateArea(width = 0, height = 0) {if (width <= 0 || height <= 0) {console.log('请输入有效的宽度和高度!');return;}const area = width * height;console.log(`矩形的面积为:${area}`);
}calculateArea(); // 输出:请输入有效的宽度和高度!
calculateArea(5, 10); // 输出:矩形的面积为:50
上述代码中,calculateArea函数定义了两个默认参数width和height,默认值均为0。当传入的宽度或高度小于等于0时,会输出错误提示信息;否则会计算并输出矩形的面积。
处理可选参数
function sendMessage(message, options = {}) {const { recipient = 'All', priority = 'Normal' } = options;console.log(`发送给${recipient}的消息:${message},优先级:${priority}`);
}sendMessage('Hello'); // 输出:发送给All的消息:Hello,优先级:Normal
sendMessage('Hi', { recipient: 'Alice', priority: 'High' }); // 输出:发送给Alice的消息:Hi,优先级:High
上述代码中,sendMessage函数定义了两个参数,其中第二个参数options是一个对象,默认值为空对象。通过解构赋值将options.recipient和options.priority赋值给对应的变量,并在输出时使用。
二、rest参数
rest参数是指在函数定义时使用三个点(…)前缀来表示可以接收任意数量的参数,并将这些参数封装成一个数组。rest参数的作用是处理不确定数量的参数,使得函数更加灵活。
使用方式 在ES6之前,为了处理不确定数量的参数,我们通常会使用arguments对象。而在ES6中,我们可以使用rest参数来替代arguments对象。
示例代码如下
function sum(...numbers) {let total = 0;for (let number of numbers) {total += number;}return total;
}console.log(sum(1, 2, 3)); // 输出:6
console.log(sum(4, 5, 6, 7)); // 输出:22
上述代码中,sum函数定义了一个rest参数numbers,它可以接收任意数量的参数,并将这些参数封装成一个数组。在函数体内,我们可以像操作数组一样对这些参数进行处理。
使用示例
计算平均值
function average(...numbers) {let sum = numbers.reduce((acc, cur) => acc + cur, 0);return sum / numbers.length;
}console.log(average(1, 2, 3)); // 输出:2
console.log(average(4, 5, 6, 7)); // 输出:5.5
上述代码中,average函数使用rest参数接收任意数量的数字,并通过数组的reduce方法求和。最后返回平均值。
合并字符串
function concatenate(...strings) {return strings.join('');
}console.log(concatenate('Hello', ' ', 'World')); // 输出:Hello World
console.log(concatenate('I', ' ', 'love', ' ', 'JavaScript')); // 输出:I love JavaScript
上述代码中,concatenate函数使用rest参数接收任意数量的字符串,并通过数组的join方法将它们合并成一个字符串。
总结
ES6的默认参数和rest参数为函数的定义和调用提供了更多的灵活性和简洁性。
-
默认参数可以为函数的参数提供默认值,避免因为缺少某些参数而导致错误;
-
rest参数可以接收任意数量的参数,并将它们封装成一个数组,使得处理不确定数量的参数更加方便。
😶 写在结尾
前端设计模式专栏
设计模式是软件开发中不可或缺的一部分,它们帮助我们解决了许多常见问题,并提供了一种优雅而可靠的方式来构建应用程序。在本专栏中,我们介绍了所有的前端设计模式,包括观察者模式、单例模式、策略模式等等。通过学习这些设计模式,并将其应用于实际项目中,我们可以提高代码的可维护性、可扩展性和可重用性。希望这个专栏能够帮助你在前端开发中更好地应用设计模式,写出高质量的代码。点击订阅前端设计模式专栏
Vue专栏
Vue.js是一款流行的JavaScript框架,用于构建用户界面。它采用了MVVM(Model-View-ViewModel)的架构模式,通过数据驱动和组件化的方式,使开发者能够更轻松地构建交互性强、可复用的Web应用程序。在这个专栏中,我们将深入探讨Vue.js的核心概念、组件开发、状态管理、路由和性能优化等方面的知识。我们将学习如何使用Vue.js构建响应式的用户界面,并探索其强大的生态系统,如Vue Router和Vuex、Pinia。通过学习这些内容,你将能够成为一名熟练的Vue.js开发者,并能够应用这些知识来构建复杂而高效的Web应用程序。点击订阅Vue专栏
JavaScript(ES6)专栏
JavaScript是一种广泛应用于网页开发和后端开发的脚本语言。它具有动态性、灵活性和易学性的特点,是构建现代Web应用程序的重要工具之一。在这个专栏中,我们将深入探讨JavaScript语言的基本语法、DOM操作、事件处理、异步编程以及常见算法和数据结构等内容。此外,我们还将介绍ES6(ECMAScript 2015)及其后续版本中引入的新特性,如箭头函数、模块化、解构赋值等。通过学习这些内容,你将能够成为一名熟练的JavaScript开发者,并能够应用这些知识来构建出高质量和可维护的Web应用程序。点击订阅JavaScript(ES6)专栏
相关文章:

ES6的默认参数和rest参数
✨ 专栏介绍 在现代Web开发中,JavaScript已经成为了不可或缺的一部分。它不仅可以为网页增加交互性和动态性,还可以在后端开发中使用Node.js构建高效的服务器端应用程序。作为一种灵活且易学的脚本语言,JavaScript具有广泛的应用场景&#x…...
深入理解WPF MVVM:探索数据绑定与命令的优雅之道
引言: WPF(Windows Presentation Foundation)是一种用于创建富客户端应用程序的框架,而MVVM(Model-View-ViewModel)则是一种在WPF中使用的架构模式。MVVM提供了一种优雅的方式来组织和管理应用程序的代码&a…...

ssrf之gopher协议的使用和配置,以及需要注意的细节
gopher协议 目录 gopher协议 (1)安装一个cn (2)使用Gopher协议发送一个请求,环境为:nc起一个监听,curl发送gopher请求 (3)使用curl发送http请求,命令为 …...

SVN下载安装(服务器与客户端)
1.下载 服务器下载:Download | VisualSVN Server 客户端下载:自行查找 2. 服务器安装 双击执行 运行 下一步 同意下一步 下一步 选中安装目录 3. 客户端安装 双击执行 下一步 4. 服务器创建仓库 5. 服务器创建用户 6. 客户端获取资源 文件夹右键...

SpringIOC之ApplicationObjectSupport
博主介绍:✌全网粉丝5W,全栈开发工程师,从事多年软件开发,在大厂呆过。持有软件中级、六级等证书。可提供微服务项目搭建与毕业项目实战,博主也曾写过优秀论文,查重率极低,在这方面有丰富的经验…...

香橙派 ubuntu实现打通内网,外网双网络,有线和无线双网卡
当香橙派 ubuntu 连了有线,和无线时,默认请求外网时,只走一个网卡,如走了内网网卡,就只能访问内访问,访问不了外网;走了外网网卡就只能访问外网,访问不了内网; 实现双网…...

Spring Boot简单多线程定时任务实现 | @Async | @Scheduled
Spring Boot简单多线程定时任务实现 实现步骤 1 创建一个Spring Boot项目 2 定义定时任务: package com.jmd.timertasktest.task;import org.springframework.context.annotation.Configuration; import org.springframework.scheduling.annotation.Async; impor…...

sklearn学习的一个例子用pycharm jupyter
环境 运行在jupyter 进行开发。即一个WEB端的开发工具。能适时显示开发的输出。后缀用的是ipynb.pycharm也可以支持。但也要提示按装jupyter. 或直接用andcoda 这里我们用pycharm进行项目创建 pip install -i https://pypi.tuna.tsinghua.edu.cn/simple jupyterlab pip ins…...

JVM的生命周期
1.加载(Loading): 在加载阶段,JVM会找到并加载Java字节码文件。加载阶段分为三个步骤:通过类的全限定名找到对应的字节码文件,创建一个与该类相关的Class对象,将类的静态数据结构存储在方法区中…...
ElasticSearch--基本操作
ElasticSearch 完成ES安装 http://101.42.93.208:5601/app/dev_tools#/console 库的操作 创建索引库 请求方式:PUT 请求路径:/索引库名,可以自定义 请求参数:mapping映射 PUT /test {"mappings": {"propertie…...
大数据应用发展史:从搜索引擎时代到机器学习时代
文章目录 搜索引擎时代数据仓库时代数据挖掘时代机器学习时代小结 大数据技术的使用经历了一个发展过程 从最开始的Google在搜索引擎中开始使用大数据技术,到现在无处不在的各种人工智能应用,伴随着大数据技术的发展,大数据应用也从曲高和寡…...

java基础之String的不可变性
目录 概述 String是如何实现不可变的 String为何设计成不可变的 1.缓存和性能优化 2.安全性 3.线程安全性 4.API设计和预测性能 概述 String类的不可变性意味着一旦创建了一个字符串对象,它的值就不能被修改。 String是如何实现不可变的 查看源码 public …...
【JS】Promise详解
概述 在 JavaScript 中,Promise 是一个表示异步操作最终完成或失败的对象。它本质上是一个返回的对象,你可以附加回调函数,而不是将回调传递给函数。 let promise new Promise((resolve, reject) > {let condition true; // 这可以是某…...

原生微信小程序如何动态配置主题颜色及如何调用子组件的方法
一、最终效果 二、步骤 1、在初始化进入项目时,获取当前主题色 2、把主题色定义成全局变量(即在app.js中设置) 3、tabBar也需要定义全局变量,在首页时需要重新赋值 三、具体实现 1、app.js onLaunch () {//获取主题数据this.set…...

Java关键字(1)
Java中的关键字是指被编程语言保留用于特定用途的单词。这些关键字不能用作变量名或标识符。以下是Java中的一些关键字: public:表示公共的,可以被任何类访问。 private:表示私有的,只能被定义该关键字的类访问。 cl…...

【机器学习合集】深度生成模型 ->(个人学习记录笔记)
深度生成模型 深度生成模型基础 1. 监督学习与无监督学习 1.1 监督学习 定义 在真值标签Y的指导下,学习一个映射函数F,使得F(X)Y 判别模型 Discriminative Model,即判别式模型,又称为条件模型,或条件概率模型 生…...
Java将PDF转换为文本
在Java中,你可以使用现有的库来将PDF文件转换为文本。下面是一个简单的示例,使用Apache PDFBox库来实现PDF到文本的转换。首先,确保在你的项目中添加了Apache PDFBox库的依赖。你可以在 Maven 项目中添加以下依赖: <!--Pdf--&g…...

Linux 运维工具之1Panel
一、1Panel 简介 1Panel 是一个现代化、开源的 Linux 服务器运维管理面板。 特点: 快速建站:深度集成 Wordpress 和 Halo,域名绑定、SSL 证书配置等一键搞定;高效管理:通过 Web 端轻松管理 Linux 服务器࿰…...

深入了解小红书笔记详情API:为内容创新提供动力
一、小红书笔记详情API简介 小红书笔记详情API是一种允许开发者访问小红书平台上的笔记详细数据的接口。通过这个API,我们可以获取笔记的标题、内容、标签、点赞数、评论数等详细信息。这些数据对于内容创作者和品牌来说至关重要,可以帮助他们了解用户喜…...

Animate 2024(Adobe an2024)
Animate 2024是一款由Adobe公司开发的动画和互动内容创作工具,是Flash的演进版本。Animate 2024为设计师和开发者提供了更丰富的功能,让他们能够创建各种类型的动画、交互式内容和多媒体应用程序。 Animate 2024具有以下特点: 强大的设计工…...
论文解读:交大港大上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架(二)
HoST框架核心实现方法详解 - 论文深度解读(第二部分) 《Learning Humanoid Standing-up Control across Diverse Postures》 系列文章: 论文深度解读 + 算法与代码分析(二) 作者机构: 上海AI Lab, 上海交通大学, 香港大学, 浙江大学, 香港中文大学 论文主题: 人形机器人…...

【OSG学习笔记】Day 18: 碰撞检测与物理交互
物理引擎(Physics Engine) 物理引擎 是一种通过计算机模拟物理规律(如力学、碰撞、重力、流体动力学等)的软件工具或库。 它的核心目标是在虚拟环境中逼真地模拟物体的运动和交互,广泛应用于 游戏开发、动画制作、虚…...

高频面试之3Zookeeper
高频面试之3Zookeeper 文章目录 高频面试之3Zookeeper3.1 常用命令3.2 选举机制3.3 Zookeeper符合法则中哪两个?3.4 Zookeeper脑裂3.5 Zookeeper用来干嘛了 3.1 常用命令 ls、get、create、delete、deleteall3.2 选举机制 半数机制(过半机制࿰…...
vue3 字体颜色设置的多种方式
在Vue 3中设置字体颜色可以通过多种方式实现,这取决于你是想在组件内部直接设置,还是在CSS/SCSS/LESS等样式文件中定义。以下是几种常见的方法: 1. 内联样式 你可以直接在模板中使用style绑定来设置字体颜色。 <template><div :s…...
鸿蒙中用HarmonyOS SDK应用服务 HarmonyOS5开发一个医院查看报告小程序
一、开发环境准备 工具安装: 下载安装DevEco Studio 4.0(支持HarmonyOS 5)配置HarmonyOS SDK 5.0确保Node.js版本≥14 项目初始化: ohpm init harmony/hospital-report-app 二、核心功能模块实现 1. 报告列表…...
【碎碎念】宝可梦 Mesh GO : 基于MESH网络的口袋妖怪 宝可梦GO游戏自组网系统
目录 游戏说明《宝可梦 Mesh GO》 —— 局域宝可梦探索Pokmon GO 类游戏核心理念应用场景Mesh 特性 宝可梦玩法融合设计游戏构想要素1. 地图探索(基于物理空间 广播范围)2. 野生宝可梦生成与广播3. 对战系统4. 道具与通信5. 延伸玩法 安全性设计 技术选…...

AI,如何重构理解、匹配与决策?
AI 时代,我们如何理解消费? 作者|王彬 封面|Unplash 人们通过信息理解世界。 曾几何时,PC 与移动互联网重塑了人们的购物路径:信息变得唾手可得,商品决策变得高度依赖内容。 但 AI 时代的来…...
Java编程之桥接模式
定义 桥接模式(Bridge Pattern)属于结构型设计模式,它的核心意图是将抽象部分与实现部分分离,使它们可以独立地变化。这种模式通过组合关系来替代继承关系,从而降低了抽象和实现这两个可变维度之间的耦合度。 用例子…...
es6+和css3新增的特性有哪些
一:ECMAScript 新特性(ES6) ES6 (2015) - 革命性更新 1,记住的方法,从一个方法里面用到了哪些技术 1,let /const块级作用域声明2,**默认参数**:函数参数可以设置默认值。3&#x…...

sshd代码修改banner
sshd服务连接之后会收到字符串: SSH-2.0-OpenSSH_9.5 容易被hacker识别此服务为sshd服务。 是否可以通过修改此banner达到让人无法识别此服务的目的呢? 不能。因为这是写的SSH的协议中的。 也就是协议规定了banner必须这么写。 SSH- 开头,…...