作者：Michael Wanyoike and Sam Deering
https://www.sitepoint.com/shorthand-javascript-techniques
對於任何JavaScript開發人員來說，這篇文章很值得一讀。這裏記錄了我多年來學習的JavaScript代碼簡潔寫法，也給大家提供一些編碼上的思考和取捨。
1. 三元(三目)運算符
如果只想在一行中編寫if..else語句時，這是一個很好的節省代碼的方式。
常規：
簡寫：
嵌套版三元運算：
2. 短路判斷簡寫
將變量值分配給另一個變量時，您可能希望確保源變量不爲null，undefined或爲空。您可以編寫帶有多個條件的長 if 語句，也可以使用短路判斷。
常規：
簡寫：
再來點示例，嘗試一下：
請注意，如果將variable1設置爲false或0，則賦值爲bar。
3. 聲明變量簡寫
常規：
簡寫：
4. If真值判斷簡寫
這可能是微不足道的，但值得一提。在執行“if 檢查”時，有時可以省略全等運算符。
常規：
簡寫：
注意：這兩個例子並不完全相同，因爲只要likeJavaScript是一個真值，檢查就會通過。
這是另一個例子。如果a不等於true，那就做點什麼吧。
常規：
簡寫：
5. For循環簡寫
如果您想要純JavaScript並且不想依賴外部庫（如jQuery或lodash），這個小技巧非常有用。
常規：
簡寫：
如果您只想訪問索引，請執行以下操作：
如果要訪問文字對象中的鍵，這也適用：
Array.forEach簡寫：
6. 短路判斷賦值
如果預期參數爲null或undefined，我們可以簡單地使用短路邏輯運算符，只需一行代碼即可完成相同的操作，而不是編寫六行代碼來分配默認值。
常規：
簡寫：
7. 十進制基本指數
你可能已經看過這個了。它本質上是一種編寫沒有尾隨零的數字的奇特方式。例如，1e7實質上意味着1後跟7個零。它表示一個十進制基數（JavaScript解釋爲浮點類型）等於10,000,000。
常規：
簡寫：
8. 對象屬性簡寫
在JavaScript中定義對象很簡單。ES6提供了一種更簡單的方法來爲對象分配屬性。如果變量名稱與對象鍵相同，則可以使用簡寫表示法。
常規：
簡寫：
9. 箭頭函數簡寫
經典函數以簡單的形式易於讀寫，但是一旦你開始將它們嵌套在其他函數調用中，它們往往會變得有點冗長和混亂。
常規：
簡寫：
重要的是要注意，箭頭函數內部的 this 與常規函數的不同，因此這兩個示例並不嚴格等效。有關詳細信息，請參閱有關箭頭函數語法的文章。
10. 隱式返回簡寫
Return 是我們經常使用的關鍵字，用於返回函數的最終結果。具有單個語句的箭頭函數將隱式返回其執行結果（函數必須省略大括號（{}）以省略return關鍵字）。
要返回多行語句（例如對象），必須使用 () 而不是 {} 來包裝函數體。這可確保將代碼執行爲單個語句。
常規：
簡寫：
11. 默認參數值
您可以使用if語句定義函數參數的默認值。在ES6中，您可以在函數聲明本身中定義默認值。
常規：
簡寫：
12. 模板字符串
您是否厭倦了使用 '+' 將多個變量連接成一個字符串？有沒有更簡單的方法？如果你能夠使用ES6，那麼你很幸運。您需要做的就是使用反引號，並使用 ${} 來包含變量。
常規：
簡寫：
13. 解構賦值簡寫
如果您正在使用任何流行的Web框架，那麼很有可能您將使用對象形式的數組或數據，在組件和API之間傳遞信息。數據對象到達組件後，您需要將其解構。
常規：
簡寫：
您甚至可以分配自己的變量名稱，比如entity替換原來對象中的contact:
14. 多行字符串
如果您發現自己需要在代碼中編寫多行字符串，那麼您可以編寫它：
常規：
但是有一種更簡單的方法。只需使用反引號。
簡寫：
15. 展開(spread)操作符
ES6中引入的展開運算符有幾個用例，可以使JavaScript代碼更高效，更有趣。它可以用來替換某些數組函數。展開操作符只是連續的三個點。
常規：
簡寫：
與 concat() 函數不同，您可以使用spread運算符在另一個數組內的任何位置插入數組。
您還可以將spread運算符與ES6解構表示法結合使用：
16. 強制參數
默認情況下，如果未傳遞值，JavaScript會將函數參數設置爲undefined。其他一些語言會引發警告或錯誤。要強制執行參數賦值，可以使用 if 語句在未定義時拋出錯誤。
常規：
簡寫：
17. Array.find
如果您曾經在純JavaScript中編寫過 find 函數，那麼您可能已經使用了for循環。在ES6中，引入了一個名爲 find() 的新數組函數
常規：
簡寫：
18. Object[key]
你知道Foo.bar也可以寫成Foo ['bar']嗎？起初，似乎沒有理由應該這樣寫。但是，這種表示法可以爲編寫可重用代碼塊提供方便。
思考一下，驗證函數的這個簡化示例：
這個功能完美地完成了它的工作，但是請考慮這樣一種情況，即您需要驗證的表單有很多，表單都具有不同字段和規則。構建可在運行時配置的通用驗證函數不是更好嗎？
簡寫：
現在我們有了一個通用驗證函數，可以在所有表單中重用，而無需爲每個表單編寫自定義驗證函數。
19. 雙取反運算
雙取反運算符有一個非常實用的場景。您可以將它用作 Math.floor() 的替代品。雙取反運算符的優點是它可以更快地執行相同的操作。
常規：
簡寫：
20. 數學指數冪函數
常規：
簡寫：
21. 將字符串轉換爲數字
有時，您的代碼會接收String類型的參數，但需要以數字類型處理。這不是什麼大問題，我們可以進行快速轉換。
常規：
簡寫：
22. 對象屬性賦值
考慮以下代碼：
你會如何把它們合併爲一個對象？
一種方法是編寫一個將第二個對象的數據複製到第一個對象的函數。
最簡單的方法是，使用ES6中引入的 Object.assign 函數：
您還可以使用ES8中引入的對象銷燬表示法：
您可以合併的對象屬性數量沒有限制。如果確實具有相同屬性名稱的對象，則將按合併的順序覆蓋值。
23. 取反運算 和 IndexOf
使用數組執行查找時，indexOf() 函數用於檢索您要查找的項目的位置。如果未找到該項，則返回值-1。在JavaScript中，0被認爲是'falsy'，而大於或小於0的數字被認爲是'truthy'。因此，必須像這樣編寫正確的代碼。
常規：
簡寫：
取反（〜）運算符對 -1 以外的任何值，都返回 truthy 值。對它進行非運算，直接 !〜。
或者，我們也可以使用 includes() 函數：
24. Object.entries()
這是ES8中引入的一項功能，允許您將對象轉換爲鍵/值對數組。請參閱以下示例：
25. Object.values()
這也是ES8中引入的一個新功能，它執行與 Object.entries() 類似的功能，但沒有key部分：
結語
- 工作中實際用到的簡便方法有很多，希望大家能提出自己的簡潔編碼方式，評論區等大家~
喜歡博主的可以點贊關注一下
長得美的，長得帥的都關注了
現在就差你了
還不長按關注一下
----------------- END -----------------