在這篇簡短的文章中,我們將了解如何使用 JavaScript 計算段落中的單詞數,以及一些實際示例。
作為一名 JavaScript 開發人員,有時您需要限制用戶在文本框中的輸入。有兩種方法可以限制用戶輸入:按字符數或按字數。今天,我們將討論后者——如何在 JavaScript 中計算字符串中的單詞數。
JavaScript 示例:計算字符串中的單詞數
在本節中,我們將構建一個自定義 JavaScript 函數,該函數允許您計算字符串中的所有單詞數。
讓我們快速瀏覽一下以下示例。
立即學習“Java免費學習筆記(深入)”;
如您所見,我們創建了 getWordCount JavaScript 函數,該函數采用字符串參數并給出給定字符串中所有單詞的總數。
讓我們了解它是如何工作的。首先,我們使用 split JavaScript 字符串方法在空格字符上分割字符串,結果,我們得到一個字符串數組。
接下來,我們使用 filter JavaScript 數組方法來過濾掉空字符串——當字符串連續有兩個空格時,這些空字符串就會出現。
最后,我們有一個單詞數組(以及其他標點符號),我們可以使用數組 length 屬性來計算數組中元素的數量。這給了我們給定字符串中的單詞總數!
JavaScript 示例:使用正則表達式計算字符串中的單詞數
在上一節中,我們討論了一個 JavaScript 示例來演示如何計算字符串中的所有單詞。我們通過分割空格字符來做到這一點。但是,我們必須過濾掉當源字符串連續有多個空格時可能出現的空字符串。
在本節中,我們將使用正則表達式修改上述示例。讓我們快速瀏覽一下下面的示例。
這一次,我們使用 /s+/ 正則表達式分割字符串,表示一個或多個空白字符。這樣,我們就可以直接得到我們想要的結果,而不需要過濾空字符串。此外, s 模式匹配新行和制表符,使得結果比直接匹配空格字符更加穩健。正如你所看到的,借助 split JavaScript 字符串方法,計算字符串中的單詞數變得更加容易!
現實世界的例子
在本節中,我們將看到一個實際示例來演示我們在前面幾節中構建的 getWordCount 函數的用法。
讓我們看一下以下示例,當用戶在文本區域中鍵入內容時,該示例會顯示實時字數計數器。
因此,正如您所看到的,當用戶在文本區域中鍵入內容時,它會顯示一個實時計數器!您可以使用并擴展此示例,以便在您想要限制輸入文本時向用戶顯示一條消息。
結論
今天,我們通過幾個示例討論了如何在 JavaScript 中計算單詞數。