這是在網(wǎng)上看見的es6展開運算符的總結(jié)，原文地址：http://www.jianshu.com/p/c5230c11781b

作者：可木Changer
鏈接：http://www.jianshu.com/p/c5230c11781b
來源：簡書

總結(jié)還可以，借鑒下

?

三個點(...)在es6中，有兩個含義:

　　用在形參中， 表示傳遞給他的參數(shù)集合， 類似于arguments, 叫不定參數(shù). 語法格式: ?在形參面前加三個點( ... )

　　用在數(shù)組前面，可以把數(shù)組的值全部打散，展開，叫展開運算符.?語法格式: ?在數(shù)組面前加三個點( ... )

?

不使用Apply的函數(shù)調(diào)用

我們經(jīng)常使用Function.prototype.apply，傳遞一個數(shù)組作為參數(shù)，使用數(shù)組中存放的一組參數(shù)調(diào)用一個函數(shù)。

function doStuff (x, y, z) { } var args = [0, 1, 2]; // 調(diào)用函數(shù)，傳遞args參數(shù) doStuff.apply(null, args);

采用展開用算符我們能夠在避免使用apply的同時，輕易的調(diào)用函數(shù)。只需在數(shù)組前加上展開運算符即可。

doStuff(...args);

這段代碼變得更短，更清晰，并且不需要使用多余的null!

合并數(shù)組

已經(jīng)有好多種合并數(shù)組的方法，但是展開運算符帶來了一種全新的方式。

arr1.push(...arr2) // 將arr2 追加到數(shù)組的末尾 arr1.unshift(...arr2) // 將arr2 追加到數(shù)組的開頭

如果你想要整合兩個數(shù)組，并且想把某個數(shù)組放在另一個數(shù)組的任意特定位置上，你可以這么做：

var arr1 = ['two', 'three']; var arr2 = ['one', ...arr1, 'four', 'five']; // ["one", "two", "three", "four", "five"]

這是一種比其他方式更短的語句！

拷貝數(shù)組

得到一份數(shù)組的拷貝是很常見的任務(wù)，過去我們使用Array.prototype.slice來做，但現(xiàn)在我們可以使用展開運算符：

var arr = [1,2,3]; var arr2 = [...arr]; // 和arr.slice()差不多 arr2.push(4)

記住：數(shù)組中的對象依然是引用值，所以不是任何東西都“拷貝”過去了。

將arguments或者NodeList轉(zhuǎn)換為Array

像拷貝數(shù)組一樣，我們常常使用Array.Prototype.slice來將NodeList和arguments這種類數(shù)組對象轉(zhuǎn)換為真正的數(shù)組。但是現(xiàn)在我們能夠用展開運算符輕易的實現(xiàn)這項任務(wù)：

[...document.querySelectorAll('div')]

使用此法，你甚至可以像數(shù)組一樣獲取參數(shù)。

var myFn = function(...args) { // ... }

別忘了你也能用Array.from達成相同的目的！

使用Math函數(shù)

當(dāng)然了，展開運算符將數(shù)組“展開”成為不同的參數(shù)，所以任何可接收任意數(shù)量的參數(shù)的函數(shù)，都能夠使用展開運算符來傳參。

let numbers = [9, 4, 7, 1]; Math.min(...numbers); // 1

Math對象的一系列的方法，正是展開運算符作為唯一參數(shù)傳遞給函數(shù)的完美例子。

解構(gòu)的樂趣

解構(gòu)是一項很棒的實踐方法，我在自己的React項目中以及Node.js 程序中大量的使用到它。你能夠使用解構(gòu)和展開運算符將信息解壓到你想要的變量中去：

let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 }; console.log(x); // 1 console.log(y); // 2 console.log(z); // { a: 3, b: 4 }

剩余的屬性被分配到了展開運算符之后的z變量中。

轉(zhuǎn)載于:https://www.cnblogs.com/zhangjiabin/p/7648024.html

總結(jié)

以上是生活随笔為你收集整理的ES6展开运算符（...）的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。