對象展開運算符在 JavaScript 中的 5 大應用

• 原文地址：5 Useful Things The Spread Operator Can Do in JavaScript
• 原文做者：Mehdi Aoussiad
• 譯文出自：掘金翻譯計劃
• 本文永久連接：github.com/xitu/gold-m…
• 譯者：Alfxjx
• 校對者：HayleyLL

簡介

對象展開運算符是最近 JavaScript 添加的一個很重要也頗有用的新功能。對象展開運算符可以將一個可迭代的 JavaScript 的對象的值進行展開與擴展，它也能夠在須要多重參數的時候讓咱們可以把數組和其餘的表達式進行擴展。在多種狀況下，對象展開運算符對於以簡單的方式編寫更好且乾淨的JavaScript代碼很是有用。

在這篇簡短的文章中，咱們將探討JavaScript中對象展開運算符 {…} 的一些用例。

1. 合併兩個對象

咱們能夠在 JavaScript 中使用對象展開運算符來合併兩個對象，看一看下面這個例子：

let employee = { name:'Jhon',lastname:'Doe'};
const salary = { grade: 'A', basic: '$3000' };
const summary = {...employee, ...salary};
console.log(summary);
// Prints: {name: "Jhon", lastname: "Doe", grade: "A", basic: "$3000"}
複製代碼

這裏的 employee 和 salary 對象被合併成了一個，並生成了一個包含了原來兩個對象的鍵值對的新對象。

2. 合併數組

對象展開運算符的另外一個優勢是能夠合併數組，或在一個數組的任意索引處插入另外一個數組的全部元素。

對象展開的語法使得下面的操做變得異常的簡單：

let thisArray = ['sage', 'rosemary', 'parsley', 'thyme'];

let thatArray = ['basil', 'cilantro', ...thisArray, 'coriander'];
// thatArray now equals ['basil', 'cilantro', 'sage', 'rosemary', 'parsley', 'thyme', 'coriander']
複製代碼

經過使用對象展開運算符 {…} ，咱們就能很容易的獲得想要的數組。若是使用傳統的方法，那麼步驟將會變得更加的冗長與複雜。

3. 使用對象展開運算符複製數組

咱們也可使用對象展開運算符在 JavaScript 中將一個數組的內容複製到另一個數組中。看一看下面的這個例子：

const arr1 = ['JAN', 'FEB', 'MAR', 'APR', 'MAY'];
let arr2;
arr2 = [...arr1];
console.log(arr2); // Prints:[ 'JAN', 'FEB', 'MAR', 'APR', 'MAY' ]
複製代碼

如你所見，咱們使用對象展開運算符將 arr1 的所有元素都複製到了另外的一個數組 arr2 中。

4. 計算數組中的最大值

下面的一段 ES5 代碼使用 apply() 來計算獲得了數組中的最大值：

var arr = [6, 89, 3, 45];
var maximus = Math.max.apply(null, arr); // returns 89
複製代碼

使用對象展開運算符讓這一段代碼更易讀且更容易維護。看一下下面這個例子：

const arr = [6, 89, 3, 45];
const maximus = Math.max(...arr); // returns 89
複製代碼

...arr 返回了一個數組元素的集合，也就是說它展開了這個數組。

5. 將字符串轉換成數組

咱們可使用對象展開運算符在 JavScript 中將一個英文單詞（字符串）分割成數組，下面的例子展現了它是如何將一個英文單詞轉化成字母組成的數組的：

const string = 'word';
const arr = [...string];
console.log(arr); // Prints: ["w", "o", "r", "d"]
複製代碼

有不少方法來實現這個功能，可是使用對象展開運算符，更容易寫出乾淨的 JavaScript 代碼。

結論

對象展開運算符是 JavaScript 中一種頗有用的功能。它使用起來很方便，而且可以保持代碼的整潔度，便於維護。

感謝閱讀這篇文章，但願對您有所幫助。

若是發現譯文存在錯誤或其餘須要改進的地方，歡迎到 掘金翻譯計劃 對譯文進行修改並 PR，也可得到相應獎勵積分。文章開頭的 本文永久連接 即爲本文在 GitHub 上的 MarkDown 連接。

---

掘金翻譯計劃 是一個翻譯優質互聯網技術文章的社區，文章來源爲 掘金 上的英文分享文章。內容覆蓋 Android、iOS、前端、後端、區塊鏈、產品、設計、人工智能等領域，想要查看更多優質譯文請持續關注 掘金翻譯計劃、官方微博、知乎專欄。