侧边栏壁纸
博主头像
lai博主等级

  • 累计撰写 21 篇文章
  • 累计创建 12 个标签
  • 累计收到 0 条评论

前后端结合使用ES5模板字符串

lai
lai
2021-08-26 / 0 评论 / 0 点赞 / 481 阅读 / 1,107 字
温馨提示:
本文最后更新于 2021-08-27,若内容或图片失效,请留言反馈。部分素材来自网络,若不小心影响到您的利益,请联系我们删除。

本文介绍前端如何结合后台返回数据使用ES5模板字符串特性

需求描述:

后端服务返回字符串,想在前端执行字符串中的模板字符串,该如何实现?这里借用了eval()函数

<script type="text/javascript">
	let paramDate = "2021-08-27";
	let client = `这是个前端定义的模板字符串,可以直接获取paramDate 的值:${paramDate};`;
	let serverStr = "`这是个后台服务模板字符串,需要获取到paramDate 的值:${paramDate }`";
	//错误的拼接,后台服务模板字符串不能得到解析,最后得到结果 :
	//这是个前端定义的模板字符串,可以直接获取paramDate 的值:2021-08-27;
	//`这是个后台服务模板字符串,需要获取到paramDate 的值:${paramDate }`	
	let errorJoin = client  + serverStr ;
	console.log(errorJoin);
	//正确的拼接, 通过eavl()先解析模板字符串,最后得到结果:
	//这是个前端定义的模板字符串,可以直接获取paramDate 的值:2021-08-27;
	//这是个后台服务模板字符串,需要获取到paramDate 的值:2021-08-27
	let correctJoin = client + eval(serverStr );
	console.log(correctJoin);
</script>

补充

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

eval()是全局对象的一个函数属性。
eval() 的参数是一个字符串。如果字符串表示的是表达式,eval() 会对表达式进行求值。如果参数表示一个或多个 JavaScript 语句,那么eval() 就会执行这些语句。不需要用 eval() 来执行一个算术表达式:因为 JavaScript 可以自动为算术表达式求值。
详见:eval()

0

评论区