摘要：必傳參數提供了默認參數值，沒有該參數的情況下調用函數時使用的默認值。這意味著如果未傳遞或，則調用函數，將收到錯誤。由于使用，該函數以數組的形式返回結果。使用數組析構，我們可以直接將結果賦值到相應的變量中。

想閱讀更多優質文章請猛戳GitHub博客,一年百來篇優質文章等著你！

EcmaScript 2015（ES6）已經出來好幾年了，可以巧妙地使用各種新功能。列出并討論其中一些，你會發現它們很有用。如果你知道其他好方法，請在評論中回復，共同學習。

ES6提供了默認參數值，沒有該參數的情況下調用函數時使用的默認值。

在以下示例中，將required（）函數設置為 a 和 b 參數的默認值。 這意味著如果未傳遞a或b，則調用required（）函數，將收到錯誤。

const required = () => {throw new Error("Missing parameter")};
//The below function will trow an error if either "a" or "b" is missing.
const add = (a = required(), b = required()) => a + b;
add(1, 2) //3
add(1) // Error: Missing parameter.

Array的reduce方法非常通用。它通常用于將項目數組轉換為單個值，但是你可以用它做更多的事情。

大多數這些技巧都依賴于初始值是數組或對象而不是像字符串或變量這樣的簡單值。

假設有一個項目列表的情況，并且想要更新每個項目（即 Array.map 操作），然后只過濾幾個項目（即 Array.filter ）,這意味著需要兩次循環遍歷列表！

在下面的示例中，我們希望將數組中的項的值加倍，然后選擇大于50的項。我們使用強大的 reduce 方法高效的同時做到：

const numbers = [10, 20, 30, 40];
const doubledOver50 = numbers.reduce((finalList, num) => {
  
  num = num * 2; //double each number (i.e. map)
  
  //filter number > 50
  if (num > 50) {
    finalList.push(num);
  }
  return finalList;
}, []);
doubledOver50; // [60, 80]

如果仔細查看上面的示例（2.1），就會知道 reduce 可以代替 map 或 filter ！

// 返回 0 表示對稱
const isParensBalanced = (str) => {
  return str.split("").reduce((counter, char) => {
    if (counter < 0) { // 匹配到 ")" 在 "(" 前面
      return counter;
    } else if ( char === "(") {
      return ++counter;
    } else if ( char === ")") {
      return --counter;
    } else {
      return counter; //其它字符
    }
  }, 0) // 初始化值為0
}

isParensBalanced("(())") // 0 <---對稱
isParensBalanced("(asdfds") // 0 <---對稱
isParensBalanced("(()") // 1 <---不對稱
isParensBalanced(")(") // 0 <---不對稱

有時你希望復制數組項或將數組轉換為對象。 你可以使用 reduce。

在下面的例子中，計算cars 中每個值重復數量，并將這組對應的數據放到一個對象中：

var cars = ["BMW","Benz", "Benz", "Tesla", "BMW", "Toyota"];
var carsObj = cars.reduce(function (obj, name) { 
   obj[name] = obj[name] ? ++obj[name] : 1;
  return obj;
}, {});
carsObj; // => { BMW: 2, Benz: 2, Tesla: 1, Toyota: 1 }

reduce 還可以做更多的事情，建閱讀 MDN上列出的示例。

有時候你想挑揀需要的屬性排除一些平需要的屬性（可能是因為它們包含敏感信息或者太大了）。我們不需要遍歷整個對象來挑揀它們，只需將這些不需要的數據提取到對應變量中，并將有用的保存在rest參數中。

在下面的示例中，我們不需要的屬性如_internal和tooBig屬性，我們可以將它們分配給_internal和tooBig變量（名字要一樣），并將剩余的保存到在 rest parameter cleanObject 參數中：

let {_internal, tooBig, ...cleanObject} = {el1: "1", _internal:"secret", tooBig:{}, el2: "2", el3: "3"};
console.log(cleanObject); // {el1: "1", el2: "2", el3: "3"}

在下面的示例中，engine 屬性是 car 對象的一個內嵌對象。如果我們想獲取 engine 中的 vin 值，可以使用以下解構方式：

var car = {
  model: "bmw 2018",
  engine: {
    v6: true,
    turbo: true,
    vin: 12345
  }
}
const modelAndVIN = ({model, engine: {vin}}) => {
  console.log(`model: ${model} vin: ${vin}`);
}
modelAndVIN(car); // => model: bmw 2018  vin: 12345

ES6附帶了一個擴展操作符(由三個點表示)。它通常用于解構數組值，但也可以在對象上使用它。

在下面的示例中，我們使用擴展操作符(...)在新對象中進行擴展。第二個對象中的屬性鍵將覆蓋第一個對象中的屬性鍵:

let object1 = { a:1, b:2,c:3 }
let object2 = { b:30, c:40, d:50}
let merged = {…object1, …object2} //spread and re-add into merged
console.log(merged) // {a:1, b:30, c:40, d:50}

在ES6中，可以使用 set 輕松時行數組去重，因為 set 只允許存儲惟一的值:

let arr = [1, 1, 2, 2, 3, 3];
let deduped = [...new Set(arr)] // [1, 2, 3]

使用擴展運算符（...） 將 set 轉換為數組很簡單且在集合上使用所有數組方法！

let mySet = new Set([1,2, 3, 4, 5]);
var filtered = [...mySet].filter((x) => x > 3) // [4, 5]

let param1 = 1;
let param2 = 2;

[param1, param2] = [param2, param1];
console.log(param1) // 2
console.log(param2) // 1

在下面的例子中，我們在/post獲取一個post，并在/comments 獲取相關 comments 。由于使用 async/wait，該函數以數組的形式返回結果。使用數組析構，我們可以直接將結果賦值到相應的變量中。

async function getFullPost(){
  return await Promise.all([
    fetch("/post"),
    fetch("/comments")
  ]);
}
const [post, comments] = getFullPost();

原文地址：https://medium.freecodecamp.o...

你的點贊是我持續分享好東西的動力，歡迎點贊！

干貨系列文章匯總如下，覺得不錯點個Star，歡迎 加群 互相學習。

https://github.com/qq44924588...

我是小智，公眾號「大遷世界」作者，對前端技術保持學習愛好者。我會經常分享自己所學所看的干貨，在進階的路上，共勉！

關注公眾號，后臺回復福利，即可看到福利，你懂的。