深入探索JavaScript中实用而高级的Rest参数和Spread语法

2024-01-12 16:04

本文主要是介绍深入探索JavaScript中实用而高级的Rest参数和Spread语法,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

🧑‍🎓 个人主页:《爱蹦跶的大A阿》

🔥当前正在更新专栏:《VUE》 、《JavaScript保姆级教程》、《krpano》、《krpano中文文档》

​ 

✨ 前言

        函数是JavaScript这个语言的核心,而如何处理函数的参数是函数编程中非常关键的问题。传统的JavaScript在处理不定参数以及数组的时候需要些枯燥乏味的代码。好在ES6给了我们两个光明的武器:Rest参数和Spread语法。 hoje我们一起来看看这两种语法糖独特的魅力所在。

✨ 正文

一、Rest参数

  • Rest参数语法

Rest参数语法允许我们将一个不定数量的参数表示为一个数组:

function(...args) {// ...
}
  • Rest参数的使用场景
  1. 将多个参数合并成数组
  2. 获取函数的多余参数
  3. 实现多个参数与数组的转换
  • Rest参数的使用示例
    // 将参数合并成数组
    function concat(...args) {return args;
    }concat(1, 2, 3); // [1, 2, 3]// 获取函数多余参数
    function max(first, ...nums) {let maxValue = first;for (let n of nums) {if (n > maxValue) {maxValue = n;}}return maxValue;
    }// 实现参数和数组转换
    function f(a, b, ...args) {// ...
    }const args = [1, 2, 3];
    f(...args);

详解: 

  • Rest参数与arguments对象的区别
  1. rest参数将多余的参数放入数组中,而arguments对象是一个类数组对象
  2. rest参数需要用(...args)的语法声明,而arguments对象不需要声明
  3. rest参数显式包含了某个函数的所有参数,arguments对象包含了所有参数但不会在函数签名中反映出来
  • rest参数的长度

rest参数的长度由实参决定,它取决于函数调用时实际传入的参数个数。

function foo(...args) {console.log(args.length);
}foo(1); // 1
foo(1, 2, 3); // 3

二、Spread语法

  • Spread语法概念

Spread语法可以将数组、对象在语法层面展开成多个参数或者元素。

  • Spread语法的使用场景
  1. 将数组转为参数序列
  2. 复制数组
  3. 合并数组
  • Spread语法的使用示例
    // 将数组转为参数序列
    const arr = [1, 2, 3];
    f(...arr);// 复制数组
    const arr1 = [...arr]; // 合并数组
    const arr2 = [...arr1, ...arr];

 详解:

  • 数组展开并不会复制数组

使用Spread语法展开数组时,它产生的是对原数组的引用,而不是数组的副本。

let arr1 = [1, 2];
let arr2 = [...arr1];arr2.push(3);
console.log(arr1); // [1, 2, 3]

 

  • 对象展开进行浅复制

使用扩展运算符复制对象时,它只会进行浅复制。如果对象包含嵌套对象,则只会复制对象的引用。

let obj1 = { foo: { bar: 1 } };
let obj2 = { ...obj1 }; obj2.foo.bar = 2;
console.log(obj1.foo.bar); // 2

✨ 结语

        通过本文的介绍,我们可以看到Rest参数和Spread语法在处理不定参数以及数组操作中具有非常高的表达力。

        Rest参数为我们处理函数的不定参数提供了极大的便利,我们可以非常灵活方便地将参数合并成数组。Spread语法进行数组展开,使我们可以轻松实现数组的复制和合并。

        学习并掌握好这两种语法,可以让我们的代码质量得到极大提升。它们是ES6带来的重要的语法糖,值得我们深入探索应用。

        当然,关于JavaScript的技巧还有很多,我们要保持好奇和探索的心,不断学习,成为优秀的JavaScript开发者!

这篇关于深入探索JavaScript中实用而高级的Rest参数和Spread语法的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/598400

相关文章

Spring Boot 3 整合 Spring Cloud Gateway实践过程

《SpringBoot3整合SpringCloudGateway实践过程》本文介绍了如何使用SpringCloudAlibaba2023.0.0.0版本构建一个微服务网关,包括统一路由、限... 目录引子为什么需要微服务网关实践1.统一路由2.限流防刷3.登录鉴权小结引子当前微服务架构已成为中大型系统的标

Java集合中的List超详细讲解

《Java集合中的List超详细讲解》本文详细介绍了Java集合框架中的List接口,包括其在集合中的位置、继承体系、常用操作和代码示例,以及不同实现类(如ArrayList、LinkedList和V... 目录一,List的继承体系二,List的常用操作及代码示例1,创建List实例2,增加元素3,访问元

Java中将异步调用转为同步的五种实现方法

《Java中将异步调用转为同步的五种实现方法》本文介绍了将异步调用转为同步阻塞模式的五种方法:wait/notify、ReentrantLock+Condition、Future、CountDownL... 目录异步与同步的核心区别方法一:使用wait/notify + synchronized代码示例关键

Java 8 Stream filter流式过滤器详解

《Java8Streamfilter流式过滤器详解》本文介绍了Java8的StreamAPI中的filter方法,展示了如何使用lambda表达式根据条件过滤流式数据,通过实际代码示例,展示了f... 目录引言 一.Java 8 Stream 的过滤器(filter)二.Java 8 的 filter、fi

Java中实现订单超时自动取消功能(最新推荐)

《Java中实现订单超时自动取消功能(最新推荐)》本文介绍了Java中实现订单超时自动取消功能的几种方法,包括定时任务、JDK延迟队列、Redis过期监听、Redisson分布式延迟队列、Rocket... 目录1、定时任务2、JDK延迟队列 DelayQueue(1)定义实现Delayed接口的实体类 (

springboot的调度服务与异步服务使用详解

《springboot的调度服务与异步服务使用详解》本文主要介绍了Java的ScheduledExecutorService接口和SpringBoot中如何使用调度线程池,包括核心参数、创建方式、自定... 目录1.调度服务1.1.JDK之ScheduledExecutorService1.2.spring

将java程序打包成可执行文件的实现方式

《将java程序打包成可执行文件的实现方式》本文介绍了将Java程序打包成可执行文件的三种方法:手动打包(将编译后的代码及JRE运行环境一起打包),使用第三方打包工具(如Launch4j)和JDK自带... 目录1.问题提出2.如何将Java程序打包成可执行文件2.1将编译后的代码及jre运行环境一起打包2

Java使用Tesseract-OCR实战教程

《Java使用Tesseract-OCR实战教程》本文介绍了如何在Java中使用Tesseract-OCR进行文本提取,包括Tesseract-OCR的安装、中文训练库的配置、依赖库的引入以及具体的代... 目录Java使用Tesseract-OCRTesseract-OCR安装配置中文训练库引入依赖代码实

Java中对象的创建和销毁过程详析

《Java中对象的创建和销毁过程详析》:本文主要介绍Java中对象的创建和销毁过程,对象的创建过程包括类加载检查、内存分配、初始化零值内存、设置对象头和执行init方法,对象的销毁过程由垃圾回收机... 目录前言对象的创建过程1. 类加载检查2China编程. 分配内存3. 初始化零值4. 设置对象头5. 执行

SpringBoot整合easy-es的详细过程

《SpringBoot整合easy-es的详细过程》本文介绍了EasyES,一个基于Elasticsearch的ORM框架,旨在简化开发流程并提高效率,EasyES支持SpringBoot框架,并提供... 目录一、easy-es简介二、实现基于Spring Boot框架的应用程序代码1.添加相关依赖2.添