首页 >web前端 >js教程 >为什么我的 JavaScript 模板文字没有替换变量?

为什么我的 JavaScript 模板文字没有替换变量?

DDD
DDD原创
2024-12-06 22:21:12785浏览

Why Aren't My JavaScript Template Literals Substituting Variables?

模板文字疑难解答:解决变量替换问题

模板文字用反引号 () 表示,而不是直引号,使开发人员能够嵌入字符串内的表达式。但是,您可能会遇到这样的问题:诸如“some ${string}”或“some ${string}”之类的模板文字无法将变量名称替换为其值。

原因:

当使用直引号(单引号或双引号)而不是反引号。

解决方案:

要解决此问题,只需用反引号替换模板文字周围的直引号,如下所示:

console.log(`categoryName: ${this.categoryName}\ncategoryElements: ${this.categoryElements} `)

解释:

JavaScript 模板文字利用反引号作为分隔符。这种区别将它们与使用直引号的常规字符串区分开来。通过使用反引号,您可以指示 JavaScript 解析和计算模板文字中嵌入的任何表达式,从而替换变量值。

示例:

考虑以下内容代码:

categoryName="name";
categoryElements="element";
console.log(`categoryName: ${this.categoryName}\ncategoryElements: ${categoryElements} `)

此代码将输出:

categoryName: name
categoryElements: element

相反,如果使用直引号,输出将如下所示:

${this.categoryName}
categoryElements: ${this.categoryElements}

这说明了直引号如何将模板文字视为常规文字字符串,保留文字变量名称而不是计算表达式

参考:

  • 【反引号 () 的用法JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Template_literals#Usage_of_the_backtick_character_)

以上是为什么我的 JavaScript 模板文字没有替换变量?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn