JavaScript Rest 参数:新手也能轻松掌握的进阶技巧!

一、Rest参数核心语法与特性

1. 基础定义规则

javascript 复制代码
function sum(num1, num2, ...restParams) {
  console.log(restParams); // [3,4,5]
}
sum(1,2,3,4,5);

必须末位声明 :Rest参数必须是最后一个形参,否则触发SyntaxError

自动数组转换 :未匹配的剩余参数自动转为数组,无参数时返回空数组

单函数唯一性:每个函数仅允许一个Rest参数


二、实战应用场景

1. 可变参数处理(替代arguments)

javascript 复制代码
// 传统方式
function legacySum() {
  return Array.from(arguments).reduce((a,b) => a+b);
}

// Rest参数方案
function modernSum(...nums) {
  return nums.reduce((a,b) => a+b); 
}

优势:无需手动转换数组,支持map/filter等链式操作

2. 函数参数转发

javascript 复制代码
function proxyFunc(...args) {
  targetFunc(...args); // 透传所有参数
}

3. 解构黑科技

javascript 复制代码
// 数组解构
const [head, ...tail] = [1,2,3,4]; // head=1, tail=[2,3,4]

// 对象解构
const {name, ...address} = userProfile;
相关推荐
桜吹雪3 分钟前
手搓一个简易Agent
前端·人工智能·后端
诸葛老刘23 分钟前
前端 css中的函数
前端·css
谢尔登28 分钟前
通用会话控制方案
前端·网络协议·tcp/ip·react.js·gitlab
惜茶33 分钟前
websocket操作入门
前端·javascript·websocket
摇滚侠1 小时前
Vue 项目实战《尚医通》,获取当前账户就诊人信息并展示出来,笔记42
前端·javascript·vue.js·笔记·html5
han_1 小时前
前端高频面试题之Vue-router篇
前端·vue.js·面试
用户47949283569151 小时前
接手祖传代码后,我终于理解了"组合优于继承"
javascript
C.果栗子1 小时前
Blob格式的PDF文件调用打印,浏览器文件打印(兼容)
前端·javascript·pdf
倚肆3 小时前
CSS 选择器空格使用区别详解
前端·css
盼哥PyAI实验室3 小时前
学会给网页穿衣服——学习 CSS 语言
前端·css·学习