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 是将多个元素/属性组合成一个数组/对象。
相关推荐
HinsCoder1 小时前
【渗透测试】——Upload靶场实战(1-5关)
笔记·学习·安全·web安全·渗透测试·测试·upload靶场
听风若依1 小时前
排序学习笔记
笔记·学习
Filotimo_2 小时前
【自然语言处理】实验三:新冠病毒的FAQ问答系统
人工智能·经验分享·笔记·python·学习·自然语言处理·pycharm
Rookie也要加油2 小时前
WebRtc一对一视频通话_New_peer信令处理
笔记·学习·音视频·webrtc
liangbm33 小时前
MATLAB系列09:图形句柄
图像处理·笔记·计算机视觉·matlab·matlab绘图·工程基础·图形句柄
liangbm33 小时前
MATLAB系列05:自定义函数
开发语言·笔记·matlab·教程·函数·自定义函数·按值传递
paixiaoxin4 小时前
学术新手进阶:Zotero插件全解锁,打造你的高效研究体验
人工智能·经验分享·笔记·机器学习·学习方法·zotero
晚睡早起₍˄·͈༝·͈˄*₎◞ ̑̑5 小时前
苍穹外卖学习笔记(五)
java·笔记·学习
张望远-长风万里5 小时前
运维监控专项学习笔记-id:0-需求场景、监控作用、监控能力
运维·笔记·学习
世俗ˊ6 小时前
CSS入门笔记
前端·css·笔记