解释扩展语法的好处以及它与 ES6 中的 rest 语法有何不同？

扩展运算符：扩展运算符或扩展语法允许我们在数组的情况下将数组和对象扩展为元素，在对象的情况下扩展键值对。扩展语法在 JavaScript 中由三个点 (...) 表示。

句法：

var my_var = [...array];

使用 Spread 语法的好处：

1. 它允许我们将数组或对象的所有元素包含在某种列表中。它可以扩展对象或数组并将所有值存储在相同数据类型的新变量中。

例子：

JavaScript

    // Operating spread syntax to expand an Object
    var obj1 = {
        organisation: "GFG",
        fullForm: "Geeks for Geeks"
    };
    var obj2 = {
        description: "A learning platform for Geeks."
    };
    var obj3 = {...obj2, ...obj1
    };
    console.log(obj3);
    // Operating spread syntax to expand an Array
    var fruits = ["Mango", "Banana", "Apple"];
    var moreFruits = [...arr1, "Orange", 
                "Pineapple", "Watermelon"];
    console.log(moreFruits);

输出：

扩展数组和对象

2.它允许我们将已经存在的数组的所有元素复制到一个新的数组中，并执行push、pop操作，甚至不会干扰之前的数组。

例子：

JavaScript

    // Copying an array into another 
    // array and operate pop 
    // operation without disturbing 
    // data of first array
    var arr1 = ['a', 'b', 'c', 'd', 'e'];
    var arr2 = [...arr1];
    console.log("arr1 before applying pop operation:");
    console.log(arr1);
    arr2.pop();
    console.log("arr1 & arr2 after applying"+
                " pop operation on arr2:");
    console.log(arr2);
    console.log(arr1);

输出：

3.它可以连接一个字符串或合并两个或多个数组，而无需使用concat()函数。

例子：

JavaScript

    // concatenation of two arrays without 
    // concat function using spread syntax
    var breakfast = ["Bread", "Sandwich", "Fruits"];
    var moreBreakfast = ["Salad", "Tea & Coffee"];
    console.log("Breakfast before concatenation:");
    console.log(breakfast);
      
    breakfast = [...breakfast, ...moreBreakfast];
    console.log("Breakfast after concatenation:");
    console.log(breakfast);

输出：

4. 它允许我们对数组进行数学运算。因为我们不能直接在数组上使用数学函数。扩展运算符将可迭代对象数组扩展为参数列表，允许我们操作数学函数并获得所需的结果。

例子：

JavaScript

    // Operating an array in an Math
    // function using spread operator
    var arr1 = [99, 50, 130, 1, 98, 23, 66];
    console.log("Maximum element of arr1 is:")
    console.log(Math.max(...arr1));

输出：

Rest运算符：Rest 运算符的语法 类似于Spread运算符语法，其中spread运算符将数组扩展为其元素，另一方面rest 语法用于收集数据并将该数据存储到单个变量中，我们可以进一步将其传递给函数或可以在我们的代码作为变量。

句法：

function nameOfFunction(...data)
{
    // function statement
}

示例 1：下面的示例说明了 rest 语法的使用。

JavaScript

    var sum = 0;
      
    function Addition(...data) {
        for(var i = 0; i < data.length; i++) {
            sum += data[i];
        }
        console.log("Sum of your passed data is:")
        console.log(sum);
    }
    Addition(95, 98, 2, 51, 6);

输出：

使用 rest 语法获取传递数据的总和

示例 2：

JavaScript

    var pro = 1;
      
    function Multiplication(...param) {
        for(var item = 0; item < param.length; item++) {
            pro *= param[item];
        }
        if(pro < 100) {
            console.log("Product is less than 100:");
            console.log("Product: ", pro);
            pro = 1;
            console.log("Your new product is: ");
            Multiplication(1, 2, 3, 4, 5);
            console.log("Product: ", pro);
        }
    }
    Multiplication(1, 2, 3, 4);

输出：

使用 rest 语法获取传递数据的乘积

Rest 和 Spread 语法之间的区别如下表所示：

Spread Syntax	Rest Syntax
Spread operator as its name suggests it spreads or expands the content of the given element.	Rest Syntax is just the opposite of spread syntax it collects the data and stores that data in a variable which we can use further in our code.
It expands an Array in form of elements, while in key-value pairs in the case of Objects.	It collects the data in the developer’s desired format.
You may or may not use the strict mode inside the function containing the spread operator.	You can not use the strict mode inside function containing the rest operator.
It will overwrite the identical properties inside two objects and replace the former with the latter.	It simply collects all properties and wraps them inside a container.