ECMA Script 6 Rest参数 ...param）

最新推荐文章于 2024-11-08 13:46:46 发布

汪大为 —— 无为而无不为

最新推荐文章于 2024-11-08 13:46:46 发布

阅读量592

点赞数

分类专栏：全栈攻城狮 —— 成长之路文章标签： javascript ecmascript6

本文链接：https://blog.csdn.net/wdw18668109050/article/details/121893479

版权

全栈攻城狮 —— 成长之路专栏收录该内容

6 篇文章 0 订阅

订阅专栏

本文通过示例介绍了JavaScript中的arguments对象和ES6的Rest参数在处理不定数量参数时的区别与应用。展示了如何利用Rest参数改进函数，使其更易读，包括在加法和乘法计算器功能中的应用。

摘要由CSDN通过智能技术生成

作为一个经常写Java的程序员，这个知识点，在我看来和Java 某个知识点是一样一样的，关于这个知识点叫啥来着，我真是想不起来名字，可能我就不知道这个知识点的名字吧。不说废话，能撸代码的程序员不是好的程序员。如果你要知道这个Java知识点的名字记得留言给我，让我也学习一下啊。

废话不多说：直接上代码。更多知识点介绍，看备注即可：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width,initial-scale=1.0">
        <title>3.4 Rest 参数 </title>
    </head>
    <body>


        <script type="text/javascript">

            //demo 1
            //JavaScript 的function 函数 有一个神奇的地方，无论在函数定义中声明了多少个形参，都可以传入任意数量的参数。
            //在函数内部可以通过arguments 对象 来接收 传入的参数。
            function richPlayBoy( onlyOneGirl ){
                //第一个参数会是onlyOneGirl，那么其他的女人去哪里找呢？
                console.log("PlayBoy: 我的心里只有你 ... ",onlyOneGirl);
                for(let i = 0;i<arguments.length;i++){
                    console.log("但是其实.... 还有....",arguments[i]);
                }
            }

            richPlayBoy("小丽","小美","小娜")

            // demo 2   做一个计算器功能。
            function calculate(operator){
                if(operator === "+"){
                    let result = 0; // 业务逻辑：加法基础数 0
                    for(let i = 1;i<arguments.length;i++){
                        // result = result + arguments[i];
                        result += arguments[i];
                    }
                    return result;
                }
                else  if(operator === "*"){
                    let result = 1; // 业务逻辑：乘法基础数 1
                    for(let i = 1;i<arguments.length;i++){
                        // result = result + arguments[i];
                        result *= arguments[i];
                    }
                    return result;
                }
            }

            let calculateResult = calculate("*",1,2,3,4,5,6);
            console.log(calculateResult);


            //demo 3 在 为什么引入rest 参数 .
            // 透过上面的一个列子，我们可以发现有三个问题。
            // 1.调用者从参数列表上看，不能清楚知道，该函数可以接受任意数量的参数。
            // 2. 需要引入arguments 对象解决时，有一个额外的小细节，索引要从1开始，而不是0.

            // 为了易用性考虑。ECMAScript 6  引入了rest 参数。



            // demo 2   做一个计算器功能。
            function calculate(operator,...elementData){
                if(operator === "+"){
                    let result = 0; // 业务逻辑：加法基础数 0
                    for (let elementDatum of elementData) {
                        result += elementDatum
                    }
                    return result;
                }
                else  if(operator === "*"){
                    let result = 1; // 业务逻辑：乘法基础数 1
                    for (let elementDatum of elementData) {
                        result *= elementDatum
                    }
                    return result;
                }
            }

            let calculateResult2 = calculate("*",1,2,3,4,5,6);
            console.log(calculateResult2);

        </script>
    </body>

</html>

ps : 每个函数最多只能出现一次rest 参数，并且此参数，必须要放在最后。看我标题和这个样子，理解一下。

...param){

}