[譯]這些Javascript方法幾分鐘內提升你的技能
原文地址： ofollow,noindex">These JavaScript methods will boost your skills in just a few minutes
我們今天構建的大多數應用程式都需要進行某種資料收集修改。會經常遇到對集合中的項進行處理。忘記 for 迴圈傳統方式 (let i=0; i < value.length; i++ ) 。
注意，在 使用 for-loop 時 const 報出一個錯誤。是因為它在每次執行期間重新聲明瞭值，因此 i 被 i++ 修改了。所以每當你想到使用 const 或者 let 時考慮一下 - 這個值會被重新宣告嗎？如果答案是肯定的，請選擇 let ，如果不是，請選擇 const 。 更多資訊 。
假設您要顯示產品列表並對集合進行分類，過濾，搜尋，修改或更新。或者您可能希望執行快速計算，例如求和，乘法等。實現這一目標的最佳方法是什麼？
也許你不喜歡 箭頭函式 ，不想花太多時間學習新東西，或者它們與你無關。別擔心，我將向您展示如何在ES5（功能降級）和ES6（箭頭函式）中完成它。
請注意：箭頭函式和函式宣告/表示式 不是等效 的，不能盲目替換。請注意， this 關鍵字在兩者之間的工作方式不同。
我們將要關注的方法：
- Spread operator
- for…of iterator
- includes()
- some()
- every()
- filter()
- map()
- reduce()
如果您想成為更好的Web開發人員，開始自己的事業，教別人或提高您的開發技能，我將每週釋出關於最新Web開發語言的技巧和竅門。
Spread operator
Spread Operator 將陣列擴充套件為其元素。它也可以用於物件字面量。
為什麼要用它？
- 這是一種簡單快速的方式來顯示陣列的項
- 適用於陣列和物件字面量
- 這是一種快速直觀的傳遞引數的方法
- 它只需要上面三個原因就足以說明問題了......
示例：
假設您想顯示喜歡的食物列表而不想建立迴圈函式。可以使用這樣的 Spread operator ：
for ... of iterator
for...of 語句迴圈/遍歷集合，併為您提供修改特定項的功能。它取代了傳統的 for-loop 做法。
為什麼要用它？
- 這是新增或更新元素的簡單方法
- 執行計算（求和，乘法等）
- 使用條件語句時（if，while，switch等）
- 乾淨和可讀的程式碼
示例：
假設您有一個工具箱，並且要顯示其中的所有工具。 for...of 迭代器很容易實現。
Includes()
includes() 方法用於檢查集合中是否存在特定字串，並返回 true 或 false 。請記住，它區分大小寫：如果集合中的專案是 SCHOOL ，而您搜尋 school ，它將返回 false 。
我為什麼要用它？
- 構建簡單的搜尋功能
- 這是一種確定字串是否存在的直觀方法
- 使用條件語句來修改，過濾等
- 可讀程式碼
示例：
假設您不知道車庫中有哪些車輛，您需要一個系統來檢查您想要的車是否存在。includes()來完成！
Some()
some() 方法檢查陣列中是否存在某些元素，並返回 true 或 false 。這有點類似於 includes() 方法的概念，除了引數是函式而不是字串。
為什麼要用它？
- 確保某些專案通過測試
- 使用函式執行條件語句
- 使程式碼1清晰
示例：
假設您是俱樂部老闆，並不關心誰進入俱樂部。但有些人不允許進入，因為他們喝得太多。檢視以下ES5和ES6之間的差異：
ES5：
ES6：
Every()
every() 方法遍歷陣列，檢查每個項，並返回 true 或 false 。概念和 some() 相同。除了每個項必須滿足條件語句，否則它將返回 false 。
我為什麼要用它？
- 確保每個項都通過測試
- 可以使用函式執行條件語句
- 使您的程式碼清晰
示例：
最後一次允許 some() 未成年學生進入俱樂部時，有人報告此事並且警察抓住了您。這次你不會讓這種情況發生，你將確保每個人 every() 都通過了年齡限制。
ES5
ES6
Filter()
filter() 方法建立一個包含所有通過條件的元素的新陣列。
我為什麼要用它？
- 可以避免更改原陣列
- 可以過濾掉不需要的項
- 提供更易讀的程式碼
示例：
假設想返回高於或等於 30 的價格。過濾掉所有其他價格......
ES5
ES6
Map()
map() 方法在返回新陣列方面類似於 filter() 方法。但是，唯一的區別是它用於修改項。
我為什麼要用它？
- 可以避免對原陣列進行更改
- 可以修改所需的項
- 提供更易讀的程式碼
示例：
假設有一個包含價格的產品列表。經理需要一個清單，以便在稅率增加 25％ 後顯示新價格。 map() 方法可以完成。
ES5
ES6
ES6