其實大多數編程語言都足夠開放，允許程序員用多種方式進行編程，從而獲得相似的結果。也是如此。在使用JavaScript的時候，通常我們也會找到許多方法來獲得相似的結果，但有時會造成混淆狀況的發生。

在這些方法中，其中一些用法比其他方法要好，因此這些是我的最愛，我也會在本文中把這些方法列出來。我相信，你在自己的列表中也會找到這些方法。

[[351588]]

1、忘記字符串連接

使用模板字符串（文字）

一般情況下，我們在構建一個有意義的字符串時，通常會使用+運算符將字符串連接在一起。然而，連接字符串和動態值（或表達式）時，可能會導致一些錯誤情況的發生。

模板文字（或模板字符串）允許嵌入表達式。它具有獨特的語法，也就是字符串必須用反引號（``）括起來。模板字符串可以包含動態值的占位符。這些可以通過美元符號和大括號（${expression}）進行標記。

我們來用這種方法做一個演示：

2、isInteger

想知道值是否為整數？這里有一種更清晰的方法。

JavaScript的NumberAPI提供了一種被稱為isInteger()的方法，以此來了解值是否為整數。這是非常有用的，并且更加容易被注意到。

輸出如下：

3、價值作為數字

以前你是否注意到，event.target.value即使輸入數字類型，也總是返回字符串類型值？

是的，來看下面的示例。我們有一個簡單的數字類型的文本框。這意味著它只接受數字的輸入。它具有事件處理程序來處理按鍵事件。

在事件處理程序方法中，我們取出值時會用到event.target.value。但是它返回的是一個字符串類型值。現在我還要將它解析為一個整數，這有些麻煩。如果輸入框接受浮點數（如16.56）怎么辦？parseFloat（）然后呢？還會有額外的工作和各種各樣令人困惑的事情發生！

使用event.target.valueAsNumber代替。它會以數字形式返回值。

4、AND的簡寫

讓我們考慮一個具有布爾值和函數的情況。

這里的代碼太多了，無法檢查布爾條件并調用該函數，

那么，嘗試通過AND（&&）運算符使用簡寫怎么樣？是的，避免了if的完全陳述。很酷吧！

5、帶有OR的默認值

你可以通過OR（||）運算符，輕松實現為變量設置默認值的操作。

但是等等，這是有問題的。如果這個人的年齡是0怎么辦（可能是剛出生的嬰兒）。年齡將被計算為35（0|| 35 = 35），這屬于意料之外的運算行為。

這個時候，可以輸入nullishcoalescing operator(??)。它是一個邏輯運算符，當其左側操作數為null或者undefined時，返回其右側操作數，否則返回其左側操作數。

要使用??運算符重寫以上代碼，

6、隨機項

生成隨機數或從數組中獲取隨機項都是隨手可得且非常有用的方法。這些方法已經在我的項目中出現過很多次了。

從數組中獲取隨機項，

通過一個指定了最小值和最大值的范圍來生成一個隨機數：

7、函數默認參數

在JavaScript中，函數參數（或參數）類似于這個函數的局部變量。在調用函數時，你既可以傳遞這些值，也可以選擇不傳遞。如果你不傳遞參數的值，那么它將是undefined的狀態，并且可能會導致一些其他不必要的狀況出現。

有一種簡單的方法，可以在定義參數時將默認值傳遞給函數參數。這里舉的例子是，我們將默認值Hello傳遞給greetings函數的參數的message。

8、必備的函數參數

擴展默認參數技術，我們可以將參數標記為必需。首先定義一個函數，用錯誤消息拋出錯誤，

然后將功能分配為所需參數的默認值。請記住，在調用時為參數傳遞值時，將忽略默認值。但是，如果參數值為，則考慮默認值undefined。

在上面的代碼中，name會是undefined狀態，并且會試著為其設置默認值，即isRequired()函數。它將引發一個錯誤——

9、逗號運算符

當我意識到逗號（，）是一個單獨的運算符并且從未被人注意到時，我感到非常驚訝。我已經在代碼中使用很多次了，但從未意識到它如此真實的存在。

在JavaScript中，comma（，）運算符用于從左到右計算其每個操作數，并返回最后一個操作數的值。

在上面的示例中，變量的值為ret2。與實例類似，以下代碼的輸出將值32記錄到控制臺中。

我們在哪里使用它？有什么想法嗎？comma（，）運算符最常見的用法就是在for循環中提供多個參數。

10、合并多個對象

你可能需要將兩個對象合并在一起，并創建一個更好的信息對象進行使用。你也可以使用（...）點差運算符進行同樣的操作。（是的，三個點！）

分別考慮emp和job這兩個對象，

使用spread運算符，將它們合并為：

還有另一種執行此合并的方法。使用Object.assign()。你還可以這樣做：

輸出：

要注意，spread運算符和Object.assign都要執行淺合并。在淺表合并中，第一個對象的屬性將被與第二個對象相同的屬性值覆蓋。

如果要進行深度合并，請使用lodash中_merge之類的方法。

11、解構

將數組元素和對象屬性分解為變量的技術，被稱為destructuring。讓我們來看幾個例子，

數組

在這里，我們有一系列的表情符號，

為了進行解構，我們將使用以下語法，

與執行相同，letfire = emojis[0];但具有更大的靈活性。你有沒有注意到，我用一個空白的區域替換了原有的獎杯表情符號？那么，這將輸出什么呢？

輸出：

再介紹一下rest操作符。如果要對數組進行解構，以便要將一個或多個項目分配給變量，并將其余部分放在另一個數組中，就可以使用如下所示的...rest方法完成此操作。

輸出：

對象

像數組一樣，我們也可以解構對象。

像這樣進行解構，我們就獲得了名稱，在一組變量的兩邊，并且其余部分在另一個對象中。

輸出：

12、交換變量

現在運用我們剛剛學過的destructuring概念，就變得非常簡單了。

13、isArray

確定輸入的是否為數組，還有另一個有用的方法。

14、未定義vs空

undefined是一個已經聲明，但變量未被定義的值。

null本身是一個空的且不存在的值，必須明確地分配給變量。

undefined與null并不嚴格相等

15、獲取查詢參數

window.location對象具有許多實用的方法和屬性。使用這些屬性和方法，我們可以從瀏覽器URL中獲取有關協議，主機，端口，域等的信息。

我發現其中一個非常有用的特性是，

Location.search屬性從位置URL返回查詢字符串。我們可以使用另一個有用的被稱為URLSearchParams的接口，以及location.search獲取查詢參數的值。

輸出：js

今天知識分享就先到這里了，以后我們還會提供更多編程知識和編程技巧，希望大家繼續關注并支持我們的文章