在 JavaScript 的 ES6 版本中,引入了文字。 JavaScript 包含对象文字、数组文字、数字文字、RegExp 文字等。此外,它还包含字符串文字。
字符串文字允许我们创建不带任何反斜杠字符的多行字符串,在引号中添加任何单词或句子,以及在字符串之间添加变量和数学表达式。
用户可以按照以下语法在 ECMAScript 6 中使用模板字符串文字。
let string = `This is template literal string!`;
在上面的语法中,我们使用反引号 (``) 来创建模板文字字符串。
在下面的示例中,我们使用模板文字字符串来创建多行字符串。每当我们创建带引号的字符串时,我们都需要使用“
”字符来创建新行,但是使用字符串文字,我们可以通过在新行中写入字符串来实现。
在 string1 中,新行是通过在新行中写入字符串来创建的,而在 string2 中,我们使用“
”字符来创建新行。用户可以观察输出中的 string1 和 string2,它们看起来是相同的。
let string1 = `This is first line. This is the second line. This is the third line. This is the fourth line.`; console.log(string1); // added character to create a multiline string. let string2 = "Welcome on the TutorialsPoint!"; console.log(string2);
我们可以使用模板字符串文字在字符串内添加引号。当我们创建带有双引号的字符串时,我们只能为该字符串添加单引号,而当我们创建带有单引号的字符串时,我们也只能为该字符串添加双引号。
我们使用字符串文字在 stringQuote 变量的字符串中添加了单引号。
Using the template string literals to add quotes in the string.
在下面的示例中,我们在字符串中完成了变量替换。一般来说,要在字符串中使用变量,我们需要使用“+”运算符并连接多个字符串,但模板字符串文字允许我们直接在字符串中添加变量。我们可以在 ${} 表达式中添加变量。
在variableStr变量的值中,我们插入了name、job和timePeriod变量。
Using the template string literals to add variables in the string.
在此示例中,我们将使用模板字符串文字在字符串中添加数学表达式。在 sumString 中,我们在 ${} 内添加了数学表达式。用户可以看到我们如何在字符串中对 num1 和 num2 求和。
此外,我们还对 string2 中的 2 个值进行了乘法运算。
Using the template string literals to add expression in the string.
我们可以使用模板字符串文字创建一行 HTML 并将其添加到网页中。在此示例中,我们使用字符串文字创建了 HTML 列表,并使用 的innerHTML 属性在网页中添加行 HTML。
Using the template string literals to add HTML to the document.
用户学会了在 JavaScript 中使用模板字符串文字。我们已经了解了如何创建多行字符串、变量和表达式替换、添加引号以及使用模板字符串文字创建行 HTML。
以上是如何在 ECMAScript 6 中使用模板字符串文字?的详细内容。更多信息请关注PHP中文网其他相关文章!