JS根据变量变化的字符串

已经有些基础的同学应该已经猜到了

这次用的是模板字符串

模板字面量 是允许嵌入表达式的字符串字面量。你可以使用多行字符串和字符串插值功能。它们在ES2015规范的先前版本中被称为“模板字符串”。

描述

模板字符串使用反引号 (` `) 来代替普通字符串中的用双引号和单引号。模板字符串可以包含特定语法（${expression}）的占位符。占位符中的表达式和周围的文本会一起传递给一个默认函数，该函数负责将所有的部分连接起来，如果一个模板字符串由表达式开头，则该字符串被称为带标签的模板字符串，该表达式通常是一个函数，它会在模板字符串处理后被调用，在输出最终结果前，你都可以通过该函数来对模板字符串进行操作处理。在模版字符串内使用反引号（`）时，需要在它前面加转义符（\）。–>出处

简述

带函数的字符串
这样的操作同样可以在C#中实现

目的

那么我们为什么要使用呢？
诚然，对于简单的字符串而言，用Replace同样很快速可以完成。
比如：

let a = "Hello"
let str = "text-World"
str = str.replace("text",a)
//Hello-World

let a = "Hello"
let str = `${a}-World`
//Hello-World

但是对于稍微复杂点的字符串，模板字符串就会很有用

比如MDN上的例子

ES5:

var classes = 'header'
classes += (isLargeScreen() ?
   '' : item.isCollapsed ?
     ' icon-expander' : ' icon-collapser');

在ES2015的嵌套模板字面量中：

const classes = `header ${ isLargeScreen() ? '' :
 `icon-${item.isCollapsed ? 'expander' : 'collapser'}` }`;

感觉代码是简洁一点了吧？

简单应用

如上述例子中：

let a = "Hello"
let str = `${a}-World`
//Hello-World

const classes = `header ${ isLargeScreen() ? '' :
 `icon-${item.isCollapsed ? 'expander' : 'collapser'}` }`;

都是一些简单的应用

思考

虽然这样是可以根据变量变化，但是试过就可以发现
这只能变化一次

let a = "Hello"
let str = `${a}-World`
//Hello-World

当我们继续给a赋一个新的值时
我们可以发现str不为所动

let a = "hello"
str
//Hello-World

那如何可以生成一直变化的字符串呢？

如果你有好主意可以留言分享一下啊

解决方案

我自己想了一个解决方案
不知道是否合适
首先需要一个templateStrp(普通字符)

let templateStr = "${a}-World"
let a = "hello"
let str = eval('`'+templateStr+'`')
//'hello-World'
a = "Hello"
str = eval('`'+templateStr+'`')
//Hello-World

这样虽然也可以实现，但是总感觉还可以优化，
后续有时间再说吧

如果帮助到你，能点个赞吗？