web前端培训 - ES6中如何替换字符串中的变量

web前端培训 - ES6中如何替换字符串中的变量本站　　在 ES6 之前，我们使用单引号 () 或双引号 () 来包装字符串文字

　　在 ES6 之前，我们使用单引号 () 或双引号 () 来包装字符串文字。字符串的功能非常有限。

　　为了使我们能够解决更复杂的问题，ES6 模板文字提供了允许更安全、更干净地处理字符串的语法。

　　在 ES6 之前，我们可以使用以下技术通过在字符串中手动包含换行符 (\n) 来创建多行字符串，如下所示：

　　然而，这种技术在 JavaScript 引擎中并不一致。 因此，创建一个依赖于数组和字符串连接的多行字符串是很常见的，如下所示：

　　请注意，空格是字符串的一部分。 因此，我们需要确保文本与正确的缩进对齐。 假设我们有一个 post 对象：

　　以下代码返回 post 对象的 HTML 代码。 请注意，我们使用对象解构技术将帖子对象的post 属性分配给各个变量：title、excerpt、body和tags。

　　以下是变量 postHtml 的输出。 请注意，我们如何使用间距正确缩进 li 标签。

　　此时，模板文字就像是常规 JavaScript 字符串的更好版本。 模板文字和常规字符串之间的最大区别是替换。

　　替换，允许我们在字符串中嵌入变量和表达式。 JavaScript 引擎会自动将这些变量和表达式替换为它们的值。 此功能称为字符串插值。

　　要指示 JavaScript 替换变量和表达式，请将变量和表达式放在一个特殊块中，如下所示：

　　在此示例中，tag 是适用于 Hi 模板文字的模板标签。 tag可以是具有以下签名的任何函数：

　　在此示例中，format() 函数接受三个参数：literals数组和存储在替换数组中的另外两个参数substitutions。

　　第二个参数是 9，它是数量变量的解释值。 它成为替换数组的第一个元素。 第三个参数是 80.91，它是表达式 (quantity * priceEach).toFixed(2) 的解释值。 它成为替换数组的第二个元素。