Javascript笔记 rest VS spread

1 rest

2 spread

3 二者区别

在 JavaScript 中,spread 操作符 ...rest 参数都使用三个点 ... 作为前缀,但它们在使用上有一些区别,主要体现在它们的作用和使用场景上。

Spread 操作符 ...

作用: "展开"数组或对象的元素/属性。

使用场景:

数组: 可以在创建数组时将一个数组(或数组的一部分)插入到另一个数组中。

javascript 复制代码
let arr1 = [1, 2, 3];
let arr2 = [...arr1, 4, 5];  // [1, 2, 3, 4, 5]

函数调用: 可以将数组的元素展开作为函数参数传入。

javascript 复制代码
function myFunc(a, b, c) {
  return a + b + c;
}
let nums = [1, 2, 3];
console.log(myFunc(...nums));  // 6

对象: 可以在创建对象时将另一个对象的属性插入到对象中。

javascript 复制代码
let obj1 = { a: 1, b: 2 };
let obj2 = { ...obj1, c: 3 };  // { a: 1, b: 2, c: 3 }

Rest 参数 ...

作用: 将函数参数(或数组的一部分)"组合"成一个数组。

使用场景:

  • 函数参数: 可以将多个参数组合成一个数组。通常用于获取函数的所有参数。
javascript 复制代码
function myFunc(...args) {
  // args 是一个数组
  console.log(args);
}
myFunc(1, 2, 3);  // 输出: [1, 2, 3]

总结一下:

  • Spread 是将数组/对象的元素/属性展开。
  • Rest 是将多个元素/属性组合成一个数组/对象。
相关推荐
Larry_Yanan10 分钟前
QML学习笔记(五十三)QML与C++交互:数据转换——序列类型与 JavaScript 数组的转换
c++·笔记·学习
我命由我123451 小时前
Photoshop - Photoshop 工具栏(20)混合器画笔工具
经验分享·笔记·学习·ui·职场和发展·职场发展·photoshop
搞机械的假程序猿2 小时前
普中51单片机学习笔记-点亮第一个LED
笔记·学习·51单片机
wgego3 小时前
做题笔记BUU (XSS-Lab)(1-14)
前端·笔记·xss
摇滚侠3 小时前
Spring Boot3零基础教程,响应式编程,前景提要,笔记108
java·spring boot·笔记
x_lrong5 小时前
本地访问远端环境tensorboard
linux·笔记·ai·虚拟机·云服务器·tensorboard
hit56实验室6 小时前
如何在DCU上面编译llama.cpp
笔记
WPG大大通6 小时前
AIoT | 软件:Astra MCP边缘算力构建详解
经验分享·笔记·python·硬件架构·代码
卡提西亚6 小时前
C++笔记-21-运算符重载
c++·笔记
草莓熊Lotso6 小时前
C++ 继承特殊场景解析:友元、静态成员与菱形继承的底层逻辑
服务器·开发语言·c++·人工智能·经验分享·笔记·1024程序员节