详解JS剩余参数

前端吗喽

已于 2022-05-06 18:40:00 修改

阅读量1.8k

点赞数 3

CC 4.0 BY-SA版权

分类专栏：前端学习文章标签：剩余参数 JavaScript ES6

于 2022-05-06 18:26:21 首次发布

本文链接：https://blog.csdn.net/Leon1997726/article/details/124615802

前端学习专栏收录该内容

5 篇文章

订阅专栏

本文详细介绍了JavaScript中的剩余参数语法，它允许开发者处理不确定数量的函数参数。剩余参数会以数组形式捕获所有剩余的参数，即使没有值也会是一个空数组。文中通过示例展示了如何使用剩余参数进行数组操作，并利用其创建了一个可接受任意数量参数的求和函数。此外，还探讨了剩余参数在实际编程中的简单应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

剩余参数的MDN定义：

剩余参数语法允许我们将一个不定数量的参数表示为一个数组。

语法：

function(a, b, ...theArgs) {
  // ...
}

剩余参数的本质：

剩余参数是一个数组，即使没有值，也是一个空数组

(function add(a, ...args) {
    console.log(Array.isArray(args));   //true
})(1);

既然剩余参数是一个数组，那就可以在它上面直接使用所有的数组方法和属性，例如：

function sum (first, ...args) {
    console.log(first); // 10
    console.log(args.length); //3
}
sum(10, 20, 30)；

简单应用：

利用剩余参数可以定义一个形参数量不固定的求和函数

const sum = (...args) => {
    let total = 0;
    args.forEach((item) => {
        total += item;
    });
    return total;
};
console.log(sum(10, 20)); // 30
console.log(sum(10, 20, 40)); // 70
console.log(sum(10, 20, 40, 50, 60)); // 180