ES6 新知識

neuyu發表於2021-09-09


...運算子

將一個陣列轉為用逗號分隔的引數序列。

        function push(array, ...items) {

                array.push(...items);

        }

        function add(x, y) {

                return x + y;

        }

        var numbers = [4, 38];

        add(...numbers) ;

可變引數個數的函式呼叫

            function push(array, ...items) {  

                array.push(...items);  

            }  

            function add(...vals){

                let sum=0;

                for(let i=0;i<vals.length;i++){

                    sum+=vals[i];

                }

                return sum;

            }

            let arr = [1,2,3,4,5,6];

            let sum = add(...arr);

            console.log(sum);  //21

更便捷的陣列合並

        let arr1 = [1,2];

        let arr2 = [5,6];

        let newArr = [20];

        //es5 舊寫法

        newArr = newArr.concat(arr1).concat(arr2); //[20,1,2,5,6]

        console.log(newArr);

        //es6 使用擴充套件運算子

        newArr = [20,...arr1,...arr2];  //[20,1,2,5,6]

        console.log(newArr);

替代es5的apply方法

        // ES5 的寫法  

        function f(x, y, z) {  

        // ...  

        }  

        var args = [0, 1, 2];  

        f.apply(null, args);  

        // ES6 的寫法  

        function f(x, y, z) {  

        // ...  

        }  

        var args = [0, 1, 2];  

        f(...args);  

求最大值Math.max()

            // ES5 的寫法  

            Math.max.apply(null, [14, 3, 77])  

            // ES6 的寫法  

            Math.max(...[14, 3, 77])  

            //  等同於  

            Math.max(14, 3, 77);  

透過push函式,將一個陣列新增到另一個陣列的尾部

        // ES5 的寫法  

        var arr1 = [0, 1, 2];  

        var arr2 = [3, 4, 5];  

        Array.prototype.push.apply(arr1, arr2);  

        // ES6 的寫法  

        var arr1 = [0, 1, 2];  

        var arr2 = [3, 4, 5];  

        arr1.push(...arr2);  

新建Date型別

        // ES5  

        new (Date.bind.apply(Date, [null, 2015, 1, 1]))  

        // ES6  

        new Date(...[2015, 1, 1]);  

與解構賦值結合,生成新陣列

        // ES5  

        a = list[0], rest = list.slice(1)  

        // ES6  

        [a, ...rest] = list 

下面是另外一些例子。

        const [first, ...rest] = [1, 2, 3, 4, 5];  

        first // 1  

        rest // [2, 3, 4, 5]  

        const [first, ...rest] = [];  

        first // undefined  

        rest // []:  

        const [first, ...rest] = ["foo"];  

        first // "foo"  

        rest // [] 

將字串轉為真正的陣列

        [...'hello']  

        // [ "h", "e", "l", "l", "o" ]  

將實現了 Iterator 介面的物件轉為陣列

        var nodeList = document.querySelectorAll('div');  

        var array = [...nodeList];

©著作權歸作者所有:來自51CTO部落格作者sendoffice的原創作品,如需轉載,請註明出處,否則將追究法律責任


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/4550/viewspace-2819082/,如需轉載,請註明出處,否則將追究法律責任。

相關文章