JavaScript中的字符串

們知道字符串（String）類型是 JavaScript 中的基本數(shù)據(jù)類型之一，也是最常用的數(shù)據(jù)類型啦。下面我們來學習一下關(guān)于字符串的屬性方法以及其的使用等。

什么是字符串

JavaScript 字符串其實很好理解，就是被包圍在單引號或雙引號中的任意字符。字符串可以用于存儲和處理文本。

示例：

例如像下面這樣聲明的變量都是字符串類型：

var str1 = "123";

var str2 = '12356';

var str3 = "你好，俠課島";

var str4 = 'hello summer';

var str5 = 'good_boy';

一般情況下字符串就是一個或多個字符組成，除此之外，我們還可以使用 new 關(guān)鍵字將字符串定義為一個對象：

var name = new String("summer");

console.log(name);  // 輸出：summer

不過一般情況下我們最好不要創(chuàng)建 String 對象，因為這可能會導(dǎo)致執(zhí)行速度變慢。

通過索引訪問字符串

在 JavaScript 語言中我們可以通過索引來訪問字符串中的每個字符，字符串的索引也是從 0 開始，第一個字符索引值為 [0]，第二個字符索引值為[1]，以此類推。

示例：

例如下述代碼中，我們定義了一個字符串類型的變量 username，然后輸出變量中索引值為1的字符：

var username = "summer";

console.log(username[1]);  // 輸出： u

因為索引是從 0 開始計數(shù)，那么索引為1，那應(yīng)該就是字符串中的第二個字符串，也就是 u。

獲取字符串的長度

我們先來看下面這個字符串：

var hobby = "basketball";

你能知道這個字符串的長度為多少嗎，其實你數(shù)一下就能知道，這個字符串的長度就是10。因為這個字符串有10個字符，所以它的長度為10。

這里要注意的是，字符串里面包含的空格也是會計入長度的，有1個空格長度加1，2個空格長度加2。

在 JavaScript 語言中，我們可以使用 length 屬性來獲取字符串長度，length 屬性用于返回字符串的長度(字符數(shù))。

示例：

例如獲取下面這個變量 hobby 的長度并輸出：

var hobby = "basketball";

console.log(hobby.length);  // 輸出：10

實際使用時，可能會遇到帶有空格的字符串，那么空格會計入字符的長度嗎，我們來看看：

var str1 = "hello xkd";
console.log(str1.length);  // 輸出：9

通過輸出結(jié)果我們可以知道，空格也會計入字符串的長度的。

從字符串的長度和索引的關(guān)系，我們可以得出一個結(jié)論，索引是從0開始，到length-1 結(jié)束的。

轉(zhuǎn)義字符

有些時候，字符串可能無法被解析，例如下面這個字符串：

var str1 = "嘿,你好呀~，"俠課島"";
console.log(str1);  // Uncaught SyntaxError: Unexpected identifier

那這個時候要怎么辦呢，我們可以使用反斜桿 \ 來轉(zhuǎn)義字符串中的雙引號。

示例：

var str1 = "嘿,你好呀~，\"俠課島\"";

console.log(str1);   //輸出：嘿,你好呀~，"俠課島"

轉(zhuǎn)義字符\可以用于轉(zhuǎn)義撇號，換行，引號，等其他特殊字符。下面是一些可以用于轉(zhuǎn)義字符轉(zhuǎn)義的特殊字符：

\'：單引號。
\"：雙引號。
\：反斜杠。
\n：換行符。
\r：回車符。
\t：制表符（tab）。
\b：退格符。
\f：換頁符。

字符串的方法

字符串的方法有很多，下面我們簡單來看一些比較常用到的幾個方法：

toLowerCase()：此方法用于把字符串轉(zhuǎn)為小寫，并返回新的字符串。

var str1 = "Hello XKD";
console.log(str1.toLocaleLowerCase());  

//輸出： hello xkd

toUpperCase()：此方法用于把字符串轉(zhuǎn)為大寫，并返回新的字符串。

var str1 = "Hello XKD";
console.log(str1.toUpperCase());  

//輸出： HELLO XKD

toString()：用于返回一個表示 String 對象的值。

var str1 = "Hello";
console.log(str1.toString());  

//輸出： Hello

concat()：用于連接兩個或多個字符串。

var str1 = "Hello";
var str2 = "xkd";
console.log(str1.concat(str2));  

//輸出： Helloxkd

indexOf()：返回某個指定的子字符串在字符串中第一次出現(xiàn)的位置。

var str1 = "Hello xkd, Congratulations on login!";
console.log(str1.indexOf('xkd'));  

//輸出： 6

lastIndexOf()：返回某個指定的子字符串在字符串中最后出現(xiàn)的位置。

var str1 = "Hello xkd, Congratulations on login!";
console.log(str1.lastIndexOf('o'));   

//輸出： 31

slice()：返回字符串中提取的子字符串。

var str1 = "Hello xkd, Congratulations on login!";
console.log(str1.slice(6, 8)); 

//輸出： xk

split()：把字符串分割成字符串數(shù)組。

var str1 = "Hello xkd, Congratulations on login!";
console.log(str1.split(" "));  

//輸出： ["Hello", "xkd,", "Congratulations", "on", "login!"]

substring()：提取字符串中介于兩個指定下標之間的字符。

var str1 = "Hello xkd, Congratulations on login!";
console.log(str1.substring(11, 17));  

//輸出： Congra

replace()：在字符串中用一些字符替換另一些字符，或替換一個與正則表達式匹配的子串。

var str1 = "Hello xkd, Congratulations on login!";
console.log(str1.replace("xkd", "summer"));  

//輸出： Hello summer, Congratulations on login!

match()：返回所有查找的關(guān)鍵字內(nèi)容的數(shù)組。

HTML標簽相關(guān)的字符串格式化

string nl2br ( string $string )

nl2br() 就是將\n 替換成 //javascript對\n才能夠執(zhí)行換行,對是不能執(zhí)行換行

htmlspecialchars() 把一些預(yù)定義的字符轉(zhuǎn)換為 HTML 實體。

string htmlspecialchars(string,quotestyle,[character-set])

轉(zhuǎn)換以下字符及對應(yīng)的實體

& （和號） 成為 &
" （雙引號） 成為 "
' （單引號） 成為 '
< （小于） 成為 <
> （大于） 成為 >

第二個參數(shù): ENT_COMPAT 只轉(zhuǎn)換雙引號, 保留單引號, 為默認值 compat: 兼容性

ENT_QUOTES 同時轉(zhuǎn)換兩種引號 quotes: 引號

ENT_NOQUOTES 不對引號進行轉(zhuǎn)換

<html>
<body>
<?php
$str = "John & \" 'Adams'";
echo htmlspecialchars($str, ENT_COMPAT);
echo "<br />";
echo htmlspecialchars($str, ENT_QUOTES);
echo "<br />";
echo htmlspecialchars($str, ENT_NOQUOTES);
?>
</body>
</html>

輸出結(jié)果:John & " 'Adams'

John & " 'Adams'

htmlentities() 可以將所有的非ASCII碼字符轉(zhuǎn)換為對應(yīng)的實體代碼;除字母、數(shù)字、\外, 漢字和鍵盤上其他字符都轉(zhuǎn)換

<?php
$str = "A 'quote' \" is <b>bold</b>" ;
echo htmlentities ( $str ); // 輸出后源代碼: A 'quote' is <b>bold</b>
echo htmlentities ( $str , ENT_QUOTES ); // 輸出后源代碼: A 'quote' is <b>bold</b>
?>

返回的結(jié)果:A 'quote' "is bold

A 'quote' "is bold

注意: htmlspecialchars()和htmlentities作用直接輸出HTML腳本

htmlspecialchars()和htmlentities()函數(shù)對于轉(zhuǎn)義字符"\"處理,不會轉(zhuǎn)義實體代碼,要么當轉(zhuǎn)義字符對待,要么原樣輸出;

PHP中htmlentities和htmlspecialchars的區(qū)別

這兩個函數(shù)的功能都是轉(zhuǎn)換字符為HTML字符編碼, 特別是url和代碼字符串。防止字符標記被瀏覽器執(zhí)行。

使用中文時沒什么區(qū)別, 但htmlentities會格式化中文字符使得中文輸入是亂碼。

htmlentities轉(zhuǎn)換所有的html標記, htmlspecialchars只格式化& ' " < 和 > 這幾個特殊符號

addslashes() 在指定的預(yù)定義字符前添加反斜杠。

這些預(yù)定義字符是：單引號 (') 雙引號 (") 反斜杠 (\) NULL字符(\x00)

提示：該函數(shù)可用于為存儲在數(shù)據(jù)庫中的字符串以及數(shù)據(jù)庫查詢語句準備合適的字符串。

注釋：默認情況下，PHP 指令 magic_quotes_gpc 為 on，對所有的 GET、POST 和 COOKIE數(shù)據(jù)自動運行 addslashes()。

不要對已經(jīng)被magic_quotes_gpc轉(zhuǎn)義過的字符串使用 addslashes()，因為這樣會導(dǎo)致雙層轉(zhuǎn)義。

遇到這種情況時可以使用函數(shù) get_magic_quotes_gpc() 進行檢測。(如:$c=(!get_magic_quotes_gpc())?addslashes($c):$c;)

在本例中，我們要向字符串中的預(yù)定義字符添加反斜杠：

<?php
$str = "Who's John Adams?";
echo $str . " This is not safe in a database query.<br />";
echo addslashes($str) . " This is safe in a database query.";
?>

輸出：

Who's John Adams? This is not safe in a database query.

Who\'s John Adams? This is safe in a database query.

<?php
header("Content-type:text/html; charset=utf-8");
$str = "wo are \x0a studying \x00 php";
echo $str;
echo "<br>";
echo addslashes($str);
?>

輸出:

wo are studying php

wo are studying >wo are studying \0 php< php

stripslashes() 刪除反斜線（"\"）

在提交的表單數(shù)據(jù)中 ' " \ 等字符前被自動加上一個\ ,這是配置文件php.ini中選項magic_quotes_gpc在起作用，

默認是打開的，如果不處理則將數(shù)據(jù)保存到數(shù)據(jù)庫時，有可能會被數(shù)據(jù)庫誤當成控制符號而引起錯誤。

通常htmlspecialchars()和stripslashes()函數(shù)復(fù)合的方式，聯(lián)合處理表單中的提交的數(shù)據(jù)htmlspecialchars(stripslashes())

strip_tags()

string strip_tags ( string $str [, string $allowable_tags ] )

剝?nèi)?HTML、XML 以及 PHP 的標簽。

<?php
echo strip_tags("Hello <b><i>world!</i></b>","<b>");
?>

輸出結(jié)果:Hello world!

實例:

<?php
$str = "<b>webserver;</b> & \ 'Linux' & Apache";
echo "$str"; //直接輸出
echo "<br/>";
echo htmlspecialchars($str,ENT_COMPAT); //只轉(zhuǎn)換雙引號,為默認參數(shù)
echo "<br />";
echo htmlspecialchars($str,ENT_NOQUOTES); //不對引號進行轉(zhuǎn)換
echo "<br />";
echo htmlspecialchars($str,ENT_QUOTES); //同時轉(zhuǎn)換單引號和雙引號
echo "<br />";
echo htmlentities($str); //將所有的非ASCII碼字符轉(zhuǎn)換為對應(yīng)的實體代碼
echo "<br />";
echo addslashes($str); //將" ' \ 字符前添加反斜線
echo "<br />";
echo stripslashes($str); //刪除反斜線
echo "<br />";
echo strip_tags($str); //刪除<html>標記
?>

輸出結(jié)果:

webserver; & \ 'Linux' & Apache

、charAt()

返回在指定位置的字符。

var str="abc"
console.log(str.charAt(0))//a

二、charCodeAt()

返回在指定的位置的字符的 Unicode 編碼。

var str="abc"
 console.log(str.charCodeAt(1))//98

三、concat()

連接字符串。

 var a = "abc";  
 var b = "def";  
 var c = a.concat(b);
 console.log(c);//abcdef

四、indexOf()

檢索字符串。indexOf() 方法對大小寫敏感！

var str="Hello world!"
console.log(str.indexOf("Hello"))//0
console.log(str.indexOf("World"))//-1
console.log(str.indexOf("world"))///6

五、match()

match() 方法可在字符串內(nèi)檢索指定的值，或找到一個或多個正則表達式的匹配。該方法類似 indexOf() 和 lastIndexOf()，但是它返回指定的值，而不是字符串的位置。

var str="1 abc 2 def 3"
console.log(str.match(/\d+/g))//123

六、replace()

replace() 方法用于在字符串中用一些字符替換另一些字符，或替換一個與正則表達式匹配的子串。

var str="abc Def!"
console.log(str.replace(/abc/, "CBA"))//CBA Def!

七、search()

search() 方法用于檢索字符串中指定的子字符串，或檢索與正則表達式相匹配的子字符串。要執(zhí)行忽略大小寫的檢索，請追加標志 i。如果沒有找到任何匹配的子串，則返回 -1。

var str="abc DEF!"
console.log(str.search(/DEF/))//4

八、slice()

提取字符串的片斷，并在新的字符串中返回被提取的部分。
stringObject.slice(start,end);

start :要抽取的片斷的起始下標。如果是負數(shù)，則該參數(shù)規(guī)定的是從字符串的尾部開始算起的位置。也就是說，-1 指字符串的最后一個字符，-2 指倒數(shù)第二個字符，以此類推。

end：緊接著要抽取的片段的結(jié)尾的下標。若未指定此參數(shù)，則要提取的子串包括 start 到原字符串結(jié)尾的字符串。

如果該參數(shù)是負數(shù)，那么它規(guī)定的是從字符串的尾部開始算起的位置。

var str="abc def ghk"
console.log(str.slice(6))//f ghk

九、split()

把字符串分割為字符串數(shù)組。

var str="abc def ghi jkl"    
console.log(str.split(" "))//["abc", "def", "ghi", "jkl"]
console.log(str.split("") )//["a", "b", "c", " ", "d", "e", "f", " ", "g", "h", "i", " ", "j", "k", "l"]
console.log(str.split(" ",3))//["abc", "def", "ghi"]

十、toLocaleLowerCase()

把字符串轉(zhuǎn)換為小寫。

var str="ABC def!"
console.log(str.toLocaleLowerCase())//abc def!

十一、toLocaleUpperCase()

把字符串轉(zhuǎn)換為大寫。

var str="ABC def!"
console.log(str.toLocaleUpperCase())//ABC DEF!

十二、toLowerCase()

把字符串轉(zhuǎn)換為小寫。

var str="ABC def!"
console.log(str.toLowerCase())//abc def!

十三、toUpperCase()

把字符串轉(zhuǎn)換為大寫。

var str="ABC def!"
console.log(str.toUpperCase())//ABC DEF!

十四、substr()

從起始索引號提取字符串中指定數(shù)目的字符。
stringObject.substr(start,length)。

start：必需。要抽取的子串的起始下標。必須是數(shù)值。如果是負數(shù)，那么該參數(shù)聲明從字符串的尾部開始算起的位置。也就是說，-1 指字符串中最后一個字符，-2 指倒數(shù)第二個字符，以此類推。

length：可選。子串中的字符數(shù)。必須是數(shù)值。如果省略了該參數(shù)，那么返回從 stringObject 的開始位置到結(jié)尾的字串。

var str="abc def"
console.log(str.substr(2))//c def
console.log(str.substr(2,4))// c de

十五、substring()

提取字符串中兩個指定的索引號之間的字符。
stringObject.substring(start,stop)。

start ：必需。一個非負的整數(shù)，規(guī)定要提取的子串的第一個字符在 stringObject 中的位置。

stop ：可選。一個非負的整數(shù)，比要提取的子串的最后一個字符在 stringObject 中的位置多 1。如果省略該參數(shù)，那么返回的子串會一直到字符串的結(jié)尾。

var str="abc def"
console.log(str.substring(2))//c def
console.log(str.substring(2,4))// c

相同點：如果只是寫一個參數(shù)，兩者的作用都一樣：都是是截取字符串從當前下標以后直到字符串最后的字符串片段。
substr(startIndex);
substring(startIndex);

var str = '123456789';
console.log(str.substr(2));    //  "3456789"
console.log(str.substring(2)) ;//  "3456789"

不同點：第二個參數(shù)
substr（startIndex,lenth）：第二個參數(shù)是截取字符串的長度（從起始點截取某個長度的字符串）；
substring（startIndex, endIndex）：第二個參數(shù)是截取字符串最終的下標（截取2個位置之間的字符串,‘含頭不含尾’）。

console.log("123456789".substr(2,5));    //  "34567"
console.log("123456789".substring(2,5)) ;//  "345"

ES6新增的操作字符串的方法

一、codePointAt()

let s = 'a';
s.codePointAt(0) // 134071
s.codePointAt(1) // 57271
s.codePointAt(2) // 97

codePointAt方法的參數(shù)，是字符在字符串中的位置（從 0 開始）。

上面代碼中，JavaScript 將“a”視為三個字符，codePointAt 方法在第一個字符上，正確地識別了“”，返回了它的十進制碼點 134071（即十六進制的20BB7）。

在第二個字符（即“”的后兩個字節(jié)）和第三個字符“a”上，codePointAt方法的結(jié)果與charCodeAt方法相同。

二、String.fromCodePoint()

ES5 提供String.fromCharCode方法，用于從碼點返回對應(yīng)字符，但是這個方法不能識別 32 位的 UTF-16 字符（Unicode 編號大于0xFFFF）。

String.fromCharCode(0x20BB7)
// "?"

上面代碼中，String.fromCharCode不能識別大于0xFFFF的碼點，所以0x20BB7就發(fā)生了溢出，最高位2被舍棄了，最后返回碼點U+0BB7對應(yīng)的字符，而不是碼點U+20BB7對應(yīng)的字符。

ES6 提供了String.fromCodePoint方法，可以識別大于0xFFFF的字符，彌補了String.fromCharCode方法的不足。

在作用上，正好與codePointAt方法相反。

String.fromCodePoint(0x20BB7)
// ""
String.fromCodePoint(0x78, 0x1f680, 0x79) === 'x\uD83D\uDE80y'
// true

三、字符串的遍歷器接口 for of

for (let codePoint of 'abc') {
  console.log(codePoint)
}
// "a"
// "b"
// "c"

除了遍歷字符串，這個遍歷器最大的優(yōu)點是可以識別大于0xFFFF的碼點，傳統(tǒng)的for循環(huán)無法識別這樣的碼點。

四、at（）

at方法可以識別Unicode 編號大于0xFFFF的字符，返回正確的字符。

‘a(chǎn)bc’.at(0)//"a"
'吉'.at(0)//"吉"

五、normalize()

許多歐洲語言有語調(diào)符號和重音符號。為了表示它們，Unicode 提供了兩種方法。一種是直接提供帶重音符號的字符，比如ǒ（u01D1）。

另一種是提供合成符號（combining character），即原字符與重音符號的合成，兩個字符合成一個字符，比如O（u004F）和ˇ（u030C）合成ǒ（u004Fu030C）。

這兩種表示方法，在視覺和語義上都等價，但是 JavaScript 不能識別。

'\u01D1'==='\u004F\u030C' //false    
'\u01D1'.length // 1
'\u004F\u030C'.length // 2

上面代碼表示，JavaScript 將合成字符視為兩個字符，導(dǎo)致兩種表示方法不相等。
ES6 提供字符串實例的normalize()方法，用來將字符的不同表示方法統(tǒng)一為同樣的形式，這稱為 Unicode 正規(guī)化。

'\u01D1'.normalize() === '\u004F\u030C'.normalize()
// true

六、includes(), startsWith(), endsWith()

傳統(tǒng)上，JavaScript 只有indexOf方法，可以用來確定一個字符串是否包含在另一個字符串中。ES6 又提供了三種新方法。

**includes()**：返回布爾值，表示是否找到了參數(shù)字符串。
**startsWith()**：返回布爾值，表示參數(shù)字符串是否在原字符串的頭部。
**endsWith()**：返回布爾值，表示參數(shù)字符串是否在原字符串的尾部。
let s = 'Hello world!';    
s.startsWith('Hello') // true
s.endsWith('!') // true
s.includes('o') // true

這三個方法都支持第二個參數(shù)，表示開始搜索的位置。

let s = 'Hello world!';    
s.startsWith('world', 6) // true
s.endsWith('Hello', 5) // true
s.includes('Hello', 6) // false

上面代碼表示，使用第二個參數(shù)n時，endsWith的行為與其他兩個方法有所不同。它針對前n個字符，而其他兩個方法針對從第n個位置直到字符串結(jié)束。

七、repeat()

repeat方法返回一個新字符串，表示將原字符串重復(fù)n次。

'x'.repeat(3) // "xxx"
'hello'.repeat(2) // "hellohello"
'na'.repeat(0) // ""

參數(shù)如果是小數(shù)，會被取整。

'na'.repeat(2.9) // "nana"

如果repeat的參數(shù)是負數(shù)或者Infinity，會報錯。

'na'.repeat(Infinity)
// RangeError
'na'.repeat(-1)
// RangeError

八、padStart()，padEnd()

ES2017 引入了字符串補全長度的功能。如果某個字符串不夠指定長度，會在頭部或尾部補全。padStart()用于頭部補全，padEnd()用于尾部補全。

'x'.padStart(5, 'ab') // 'ababx'
'x'.padStart(4, 'ab') // 'abax'


'x'.padEnd(5, 'ab') // 'xabab'
'x'.padEnd(4, 'ab') // 'xaba'

上面代碼中，padStart和padEnd一共接受兩個參數(shù)，第一個參數(shù)用來指定字符串的最小長度，第二個參數(shù)是用來補全的字符串。

如果原字符串的長度，等于或大于指定的最小長度，則返回原字符串。

'xxx'.padStart(2, 'ab') // 'xxx'
'xxx'.padEnd(2, 'ab') // 'xxx'

如果用來補全的字符串與原字符串，兩者的長度之和超過了指定的最小長度，則會截去超出位數(shù)的補全字符串。

'abc'.padStart(10, '0123456789')
// '0123456abc'

如果省略第二個參數(shù)，默認使用空格補全長度。

'x'.padStart(4) // '   x'
'x'.padEnd(4) // 'x   '

padStart的常見用途是為數(shù)值補全指定位數(shù)。下面代碼生成 10 位的數(shù)值字符串。

'1'.padStart(10, '0') // "0000000001"
'12'.padStart(10, '0') // "0000000012"
'123456'.padStart(10, '0') // "0000123456"

另一個用途是提示字符串格式。

'12'.padStart(10, 'YYYY-MM-DD') // "YYYY-MM-12"
'09-12'.padStart(10, 'YYYY-MM-DD') // "YYYY-09-12"

九、matchAll()

matchAll方法返回一個正則表達式在當前字符串的所有匹配。

十、字符串模板

模板字符串（template string）是增強版的字符串，用反引號（`）標識。它可以當作普通字符串使用，也可以用來定義多行字符串，或者在字符串中嵌入變量。-----字符串模板，工作中用到比較多。

// 普通字符串
`In JavaScript '\n' is a line-feed.`


// 多行字符串
`In JavaScript this is
 not legal.`


console.log(`string text line 1
string text line 2`);


// 字符串中嵌入變量
let name = "Bob", time = "today";
`Hello ${name}, how are you ${time}?`

上面代碼中的模板字符串，都是用反引號表示。如果在模板字符串中需要使用反引號，則前面要用反斜杠轉(zhuǎn)義。

let greeting = `\`Yo\` World!`;

如果使用模板字符串表示多行字符串，所有的空格和縮進都會被保留在輸出之中。

$('#list').html(`
<ul>
  <li>first</li>
  <li>second</li>
</ul>
`);

上面代碼中，所有模板字符串的空格和換行，都是被保留的，比如<ul>標簽前面會有一個換行。如果你不想要這個換行，可以使用trim方法消除它。

$('#list').html(`
<ul>
  <li>first</li>
  <li>second</li>
</ul>
`.trim());

模板字符串中嵌入變量，需要將變量名寫在${}之中。

function authorize(user, action) {
  if (!user.hasPrivilege(action)) {
    throw new Error(
      // 傳統(tǒng)寫法為
      // 'User '
      // + user.name
      // + ' is not authorized to do '
      // + action
      // + '.'
      `User ${user.name} is not authorized to do ${action}.`);
  }
}

大括號內(nèi)部可以放入任意的 JavaScript 表達式，可以進行運算，以及引用對象屬性。

let x = 1;
let y = 2;


`${x} + ${y} = ${x + y}`
// "1 + 2 = 3"


`${x} + ${y * 2} = ${x + y * 2}`
// "1 + 4 = 5"


let obj = {x: 1, y: 2};
`${obj.x + obj.y}`
// "3"

模板字符串之中還能調(diào)用函數(shù)。

function fn() {
  return "Hello World";
}    
`foo ${fn()} bar`
// foo Hello World bar

如果大括號中的值不是字符串，將按照一般的規(guī)則轉(zhuǎn)為字符串。比如，大括號中是一個對象，將默認調(diào)用對象的toString方法。

如果模板字符串中的變量沒有聲明，將報錯。

// 變量place沒有聲明
let msg = `Hello, ${place}`;
// 報錯

由于模板字符串的大括號內(nèi)部，就是執(zhí)行 JavaScript 代碼，因此如果大括號內(nèi)部是一個字符串，將會原樣輸出。

`Hello ${'World'}`
// "Hello World"

模板字符串甚至還能嵌套。

在線咨詢

上一篇：HTML前端常用標簽(復(fù)習)
下一篇：使用React和CSS淡入淡出加載圖片：快速指南

您的項目需求

*請認真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。

整合營銷服務(wù)商

JavaScript中的字符串

什么是字符串

通過索引訪問字符串

獲取字符串的長度

轉(zhuǎn)義字符

字符串的方法

、charAt()

二、charCodeAt()

三、concat()

四、indexOf()

五、match()

六、replace()

七、search()

八、slice()

九、split()

十、toLocaleLowerCase()

十一、toLocaleUpperCase()

十二、toLowerCase()

十三、toUpperCase()

十四、substr()

十五、substring()

ES6新增的操作字符串的方法

一、codePointAt()

二、String.fromCodePoint()

三、字符串的遍歷器接口 for of

四、at（）

五、normalize()

六、includes(), startsWith(), endsWith()

七、repeat()

八、padStart()，padEnd()

九、matchAll()

十、字符串模板

您的項目需求