智能弦縮寫

核心要點

• JavaScript中的abbreviate()函數能夠智能地將字符串縮短到指定的最大長度，確保不會在單詞中間斷開，並去除多餘的空格。
• 該函數接受三個參數：原始輸入字符串、最大輸出長度和一個可選的後綴，添加到縮寫字符串的末尾。如果未定義後綴，則默認為“…”，表示縮寫。
• 此函數可用於需要限製字符串長度的任何場景，例如處理表單輸入、創建自定義工具提示、在基於 Web 的電子郵件列表中顯示郵件主題或預處理要通過 Ajax 發送的數據。
• 該函數的有效性在於它能夠將輸入字符串拆分為單個單詞，然後重新組合盡可能多的單詞以適應最大長度。它還會預處理輸入以去除多餘的空格。

本文將介紹一個名為abbreviate()的簡潔高效的JavaScript函數，其主要功能正如其名：智能地縮短字符串到指定的長度。它確保不會在單詞中間截斷，並預處理字符串以去除多餘的空格。以下是abbreviate函數的代碼：

<code class="language-javascript">function abbreviate(str, max, suffix) {
  if ((str = str.replace(/^\s+|\s+$/g, '').replace(/[\r\n]*\s*[\r\n]+/g, ' ').replace(/[ \t]+/g, ' ')).length <= max) {
    return str;
  }

  var
    abbr = '',
    str = str.split(' '),
    suffix = (typeof suffix !== 'undefined' ? suffix : ' ...'),
    max = (max - suffix.length);

  for (var len = str.length, i = 0; i < len; i++) {
    if ((abbr + str[i]).length <= max) {
      abbr += str[i] + ' ';
    } else {
      break;
    }
  }

  return abbr.replace(/[ ]$/g, '') + suffix;
}</code>

該函數接受三個參數：原始輸入字符串、最大輸出長度和一個可選的後綴，添加到縮寫字符串的末尾。如果未定義後綴，則默認為“…”（一個空格後跟三個點），這是一種常見且易於識別的縮寫指示方式。

函數用途

此函數可用於需要限製字符串長度的任何場景，作為簡單substr表達式的更智能的替代方案。可能的應用有很多，例如處理表單輸入、創建自定義工具提示、在基於 Web 的電子郵件列表中顯示郵件主題或預處理要通過 Ajax 發送的數據。例如，要將字符串限制為 100 個字符並添加默認後綴，我們可以這樣調用它：

<code class="language-javascript">str = abbreviate(str, 100);</code>

這在概念上等同於此substr表達式：

<code class="language-javascript">str = str.substr(0, 96) + " ...";</code>

但這是一種非常粗略的方法，因為它常常會導致輸出字符串在單詞中間斷開。 abbreviate函數專門設計為不會這樣做，它會在最後一個單詞之前拆分字符串，而不是在單詞中間拆分。因此，abbreviate()生成的輸出字符串通常會短於指定的最大長度，但絕不會長於它。該函數還考慮了縮寫後綴所需的空格，即如果指定的最大長度為 100，但後綴本身為 4 個字符，那麼我們最多只能使用 96 個主輸入字符串的字符。您可以通過傳遞空字符串來指定根本沒有後綴，或者如果您想縮寫標記字符串，則可以將其定義為 HTML 關閉標籤。例如，以下輸入：

<code class="language-javascript">abbreviate("<p>One two three four five</p>", 15, "");</code>

將產生此輸出：

<code class="language-javascript">function abbreviate(str, max, suffix) {
  if ((str = str.replace(/^\s+|\s+$/g, '').replace(/[\r\n]*\s*[\r\n]+/g, ' ').replace(/[ \t]+/g, ' ')).length <= max) {
    return str;
  }

  var
    abbr = '',
    str = str.split(' '),
    suffix = (typeof suffix !== 'undefined' ? suffix : ' ...'),
    max = (max - suffix.length);

  for (var len = str.length, i = 0; i < len; i++) {
    if ((abbr + str[i]).length <= max) {
      abbr += str[i] + ' ';
    } else {
      break;
    }
  }

  return abbr.replace(/[ ]$/g, '') + suffix;
}</code>

函數工作原理

abbreviate函數的關鍵在於能夠將輸入字符串拆分為單個單詞，然後重新組合盡可能多的單詞以適應最大長度。為了提高效率，我們需要確保單詞之間的分隔符是可預測的，最簡單的方法是最小化內部空格——將換行符和製表符轉換為空格，然後減少連續空格，以便每個內部空格塊都變成一個空格。當然，還有其他方法可以處理這個問題——例如，我們可以為分割定義更靈活的正則表達式，該表達式考慮了我們可能在單詞之間找到的所有不同類型的字符。甚至還有一個用於正則表達式的單詞邊界字符（“b”），所以我們也可以使用它。但我發現空格預處理本身很有用，尤其是在處理用戶輸入時。而按單詞邊界分割不會產生預期的結果，因為破折號、點、逗號和大多數特殊字符實際上都被視為單詞邊界。但我認為除非字符後跟空格，否則按標點符號分割單詞是不合適的，這樣連字符單詞和代碼片段就不會在中間分割。因此，該函數的第一項工作是進行空格預處理，然後如果結果已經短於指定的最大值，我們可以直接返回它：

<code class="language-javascript">str = abbreviate(str, 100);</code>

如果我們不這樣做，那麼我們可能會遇到字符串在不必縮寫時被縮寫的情況，例如：

<code class="language-javascript">str = str.substr(0, 96) + " ...";</code>

如果沒有第一個條件，我們將得到縮寫的輸出，因為指定的最大值必須考慮後綴的長度：

<code class="language-javascript">abbreviate("<p>One two three four five</p>", 15, "");</code>

而添加第一個條件則會產生未修改的輸出：

<code class="language-html"><p>One two></code>

因此，除非我們在此時返回，否則我們將繼續編譯縮寫字符串——按空格分割輸入字符串以創建單個單詞，然後迭代地將每個單詞-空格對重新組合在一起，只要縮寫字符串短於指定的最大長度。一旦我們編譯了所需的內容，我們就可以中斷迭代，然後從縮寫字符串的末尾修剪殘留的空格，然後再添加後綴，最後返回結果。從右端修剪殘留的空格然後再用默認後綴添加它看起來有點浪費，但這允許輸入後綴根本沒有空格。

結論

這就是一個簡單但智能的字符串縮寫函數，它還會預處理輸入以去除多餘的空格。根據我的經驗，這兩個要求通常會同時出現，這就是我開發此函數以這種方式工作的原因。

(由於篇幅限制，此處省略了FAQ部分。 如果需要，可以單獨提供FAQ部分的偽原創版本。)

以上是智能弦縮寫的詳細內容。更多資訊請關注PHP中文網其他相關文章！