大家好，我是 31 歲、愛折騰代碼、也愛把技術講成故事的小米。

如果你寫 JavaScript 的時間夠久，一定會有一種感覺：

JS 裏最熟悉、用得最多、但又最容易被忽略的類型，就是 String。

我們天天在用它，卻很少認真“聊一聊它”。於是有一天，我在敲代碼的時候突然腦補了一個畫面：

String 不是字符串，它是一個龐大的“文字王國”。

今天這篇文章，我就帶你跟着我，一起走進 JavaScript 的文字王國，看看 String 這個“老朋友”，到底藏了多少你可能沒認真想過的秘密。

字符字面量：文字王國的“入口大門”

故事要從“進城”説起。在 JavaScript 裏，只要你想進入文字王國，就必須從字符字面量這幾扇大門進去。

1、三種最常見的字符字面量

在 JS 裏，字符串可以用：

• 雙引號 "
• 單引號 '
• 反引號 `（模板字面量）

我第一次學 JS 的時候，特別糾結：“老師，到底用單引號還是雙引號？”

後來工作幾年才發現：JavaScript 本身不在乎，項目規範才在乎。

2、轉義字符：城門的“暗號”

如果你想在字符串裏放一些“特殊角色”，就得用轉義字符。

常見轉義字符對照表：

在文字王國裏，反斜槓就像“通行證”，告訴 JS：後面這個字符別按原來的意思理解。

字符串的特點：文字王國的“基本國法”

進了城，總要先了解這個國家的基本規則。

1、字符串是“不可變的”

這是 String 最重要、也是最容易被忽略的一點：字符串一旦創建，就不可被修改。

你以為你在改字符串，實際上 JS 在心裏冷冷地對你説了一句：“對不起，本國不支持原地修改。”

你真正能做的，只是創建一個新字符串。

字符串就像一塊已經烤好的蛋糕，你不能從中間挖一塊再塞回去，你只能重新烤一塊新的。

2、字符串有 length，但不是數組

很多新人一看到 str[0]，就誤以為字符串是數組。

錯。字符串只是“像數組一樣可讀”，但本質不是數組。

轉換為字符串：跨國公民的“身份轉換”。

在文字王國裏，經常會有“外來人口”，比如：數字、布爾值、對象……他們想進城，就必須變成字符串。

1、使用 String()

這是最安全、最通用的方式。

2、使用 toString()

但要注意：

3、經驗總結

4、隱式轉換（不推薦但你一定見過）

這是 JS 在背後偷偷做的事情。小米的忠告是：面試可以説，代碼裏少用。

模板字面量：文字王國的“高級語法”

ES6 之後，文字王國迎來了一次“技術革命”。

1、模板字面量登場

你第一次用模板字面量時，一定會有一種感覺：“以前那堆 + 拼字符串的日子，終於結束了。”

2、支持多行字符串

不用 \n，不用拼接，寫什麼樣，就是什麼樣。

字符串插值：讓字符串“活起來”

模板字面量真正的靈魂，是字符串插值。

${} 裏：

• 可以寫變量
• 可以寫表達式
• 可以寫函數調用

本質理解

字符串插值不是“拼接字符串”，而是 “在字符串裏執行 JavaScript 表達式”。

模板字面量標籤函數：文字王國的“翻譯官”

接下來這一部分，是很多人見過，但沒用過，也沒搞懂的高級玩法。

1、什麼是標籤函數？

輸出結果：

解釋一下

• strings：被 ${} 分割後的字符串數組
• values：插值表達式的值

2、標籤函數能幹嘛？

示例：防止 XSS

現實意義

• 模板引擎
• SQL 構建
• XSS 防護
• 國際化文本處理

可以理解為：標籤函數 = 字符串的“預處理器”。

原始字符串：不被轉義的“原貌文本”

最後一個點，非常細，但非常有用。

1、什麼是原始字符串？

String.raw 會保留字符串的原始內容。

2、使用場景

適合：

• 正則表達式
• Windows 路徑
• 需要精確字符的場景

一句話總結

原始字符串，就是“我寫什麼，你就給我什麼”。

總結：String 不簡單，只是你太熟了

寫到這裏，小米想説一句掏心窩子的：

String 是 JavaScript 裏最基礎的類型之一，也是最容易被低估的類型之一。

你天天在用它，但真正理解它的不可變性、模板能力、標籤函數之後，你會發現：

• 代碼更優雅
• 思路更清晰
• 面試也更有底氣

END

我是小米，一個喜歡分享技術的31歲程序員。如果你喜歡我的文章，歡迎關注我的微信公眾號“軟件求生”，獲取更多技術乾貨！

好朋友們，我們下篇見。