字串是程式設計世界最基本最重要的資料型別之一，JavaScript也不例外。下面這篇文章就來跟大家分享4個優雅的操作JavaScript字串的技巧，快來收藏吧！
JavaScript 字串是不可變的，對於儲存可以由字元、數字和 Unicode 組成的文字很方便。 JavaScript 提供了許多內建函數，允許以不同的方式建立和操作字串。下面一起來看看這4個優雅的操作 JavaScript 字串的技巧。
JavaScript中的split() 方法使用指定的分隔符號字串將一個String 物件分割成子字串數組，以一個指定的分割字符串來決定每個拆分的位置。有兩個可選參數（分隔符和可選限制計數）將字串轉換為字元或子字串數組，不設定分隔符號將傳回數組中的完整字串。分隔符號可以採用單一字元、字串，甚至正規表示式。以下是使用正規表示式將使用逗號和空格拆分字串的程式碼：
const title = "4个，JavaScript 字符串技巧"; console.log(title.split(/[\s+，/]+/)); // [ '4个', 'JavaScript', '字符串技巧' ] console.log(title.split(/[\s+，/]+/, 2)); // [ '4个', 'JavaScript' ]
透過split() 函數拆分的字串可以透過簡單地透過join ("") 連接起來。
JSON 不是僅限 JavaScript 的資料類型，並且廣泛用於前後端資料互動。 JSON.stringify() 函數用於將物件轉換為 JSON 格式的字串。通常，只需將物件作為參數即可，如下所示：
const article = {
title: "JavaScript 字符串技巧",
view: 30000,
comments: null,
content: undefined,
};
const strArticle = JSON.stringify(article);
console.log(strArticle); // {"title":"JavaScript 字符串技巧","view":30000,"comments":null}從上面的程式碼可以看到，在stringify 中會過濾掉undefined 的值，但null 值不會。
JSON.stringify() 可以接受兩個可選參數，第二個參數是一個替換器，可以在其中指定要列印的鍵的陣列或清除它們的函數。如下程式碼：
console.log(JSON.stringify(article, ["title", "comments"])); // {"title":"JavaScript 字符串技巧","comments":null}
console.log(JSON.stringify(article, [])); // {}對於一個巨大的 JSON，傳遞一個長數組可能會影響可讀性及效率。因此，可以設定替換函數並為要跳過的鍵返回undefined ，如下程式碼：
const result = JSON.stringify(article, (key, value) =>
key === "title" ? undefined : value
);
console.log(result); // {"view":30000,"comments":null}JSON.stringify() 的第三個參數透過指定縮排（在巢狀區塊中很有用）來格式化JSON，可以傳遞一個數字來設定縮排間距，甚至可以傳遞一個字串來取代空格。如下程式碼：
console.log(JSON.stringify(article, ["title"], "\t"));
輸出的格式如下：
{
"title": "JavaScript 字符串技巧"
}還有一個JSON.parse() 函數，它接受一個JSON 字串並將其轉換為一個JavaScript 物件。它還接受一個 reviver 函數，可以在傳回值之前攔截物件屬性並修改屬性值。
const reviver = (key, value) => (key === "view" ? 0 : value);
var jsonString = JSON.stringify(article);
var jsonObj = JSON.parse(jsonString, reviver);
console.log(jsonObj); // { title: 'JavaScript 字符串技巧', view: 0, comments: null }在JavaScript 中有三種建立字串的方式，可以使用單引號 '' 、雙引號"" 或反引號（鍵盤的左上方， 1 的左邊按鍵）。
const countries1 = "China"; const countries2 = "China"; const countries3 = `China`;
前兩種創建方式基本上相同，並且可以混合和匹配以連接或添加帶引號的字符串（通過使用相反的語法風格），而反引號可以對字符串進行花哨而強大的操作。
反引號也稱為模板字面量，反引號在建立多行字串和嵌入表達式時很方便。以下是如何在JavaScript 中使用字串插值建立多行字串的程式碼：
const year = "2021";
const month = 7;
const day = 2;
const detail = `今天是${year}年${month}月${day}日，
是个不错的日子！`;
console.log(detail);輸出的結果也換行了，如下：
今天是2021年7月2日， 是个不错的日子！
除了字串字面量，在${} 中允許任何有效的表達式，它可以是一個函數呼叫或表達式，甚至是一個嵌套模板。
標記模板是模板字面量的一種高級形式，它允許使用一個函數來解析模板字面量，其中內嵌的表達式是參數。如下程式碼：
const title = "JavaScript 字符串技巧";
const view = 30000;
const detail = (text, titleExp, viewExp) => {
const [string1, string2, string3] = [...text];
return `${string1}${titleExp}${string2}${viewExp}${string3}`;
};
const intro = detail`本文的标题是《${title}》，当前阅读量是： ${view}`;
console.log(intro); // 文的标题是《JavaScript 字符串技巧》，当前阅读量是：30000查找JavaScript 字串中是否存在子字串時間容易的事情，在ES6 中，只需要使用includes 函數。
但需要驗證字串是否存於資料中，主要數組中其中一項包含就返回true ，如果都不包含返回false，因此需要使用some 函數與includes 一起使用，如下程式碼：
const arrayTitles = ["Javascript", "EScript", "Golang"];
const hasText = (array, findText) =>
array.some((item) => item.includes(findText));
console.log(hasText(arrayTitles, "script")); // true
console.log(hasText(arrayTitles, "php")); // falseJavaScript 字串操作是專案中常見的操作，上面4個技巧值得學習並應用到實際開發中。
更多程式相關知識，請造訪：程式設計入門！ ！
以上是值得了解的操作JS字串的4個小技巧的詳細內容。更多資訊請關注PHP中文網其他相關文章！
