JavaScript-函数扩展运算符

扩展运算符在等号左边, 将剩余的数据打包到一个新的数组中, 🐤注意点：只能写在最后。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <script type="text/javascript">
        let [a, ...b] = [1, 3, 5];
        a = 1;
        b = [3, 5];
    </script>
</head>
<body>
</body>
</html>

扩展运算符在等号右边, 将数组中的数据解开。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <script type="text/javascript">
        let arrOne = [1, 3, 5];
        let arrTwo = [2, 4, 6];
        let res = [...arrOne, ...arrTwo];
        let arr = [1, 3, 5, 2, 4, 6];
    </script>
</head>
<body>
</body>
</html>

扩展运算符在函数的形参列表中的作用，将传递给函数的所有实参打包到一个数组中，🐤注意点：和在等号左边一样, 也只能写在形参列表的 最后。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <script type="text/javascript">
        function getSum(...values) {
            console.log(values);

            let sum = 0;
            for (let i = 0; i < values.length; i++) {
                let num = values[i];
                sum += num;
            }
            return sum;
        }

        let res = getSum(10, 20, 30, 40);
        console.log(res);
    </script>
</head>
<body>
</body>
</html>

如上是只有一个形参的函数接下来在来看看多个形式加扩展运算符的函数。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <script type="text/javascript">
        function getSum(a, ...values) {
            // function getSum(...values, a) { 会报错
            console.log(a);
            console.log(values);
        }

        getSum(10, 20, 30);
    </script>
</head>
<body>
</body>
</html>