ES6 深入理解 ${ } 模版

最新推荐文章于 2024-03-31 09:30:02 发布

一百个Chocolate

最新推荐文章于 2024-03-31 09:30:02 发布

阅读量3.2k

点赞数 5

分类专栏： ECMAScript 6 学习文章标签：字符串 js javascript vue css

原则上允许部分内容转载，转载请注明原文章地址！

本文链接：https://blog.csdn.net/weixin_42429718/article/details/104593324

版权

21 篇文章 13 订阅

订阅专栏

本文将带你深入理解ES6中 ${ } 模版

后续的文章都会与前端有关，欢迎各位同路途的人一起交流学习，3月份又是努力的开头，加油！

如果想更多了解ES6，请参考之前写过的一些文章：

在ES6中，不像过去了，我们有了专门的对于字符串符号，如下：

`abc`

变成了 `` 数字键1左边那个（可能还不知道位置）【滑稽】

给出如下代码，看看会是怎样的情况呢？

let c = `5`
let a = `sajhdkahdkjahshj${c+c}`;
console.log(a);

好，看来你已经明白了模板是怎样用的呢，那我们就可以深入一点了【滑稽】

那再看看如下代码，又会是怎样的情况呢？

let json = {
	'div':`<div></div>`,
	'span':`<span></span>`
}
document.write(`${json.div+json.span+json.div}`)

检查Elements，发现，多了几个标签

将字符串和模板一起使用试试？

let a = '5';
let b = '20';
console.log(`${a + b}`)

显然，就是一串表白的字符串了

或许，还是觉得一般般是吧，那来点有 x 格的代码

function show(){
	console.log(`这能不能打印出来呢？`);
};
show``;

？？？（黑人问号）
我们调用函数不是应该是 show() 这样吗，怎么还可以这操作？？？

诶，还真可以，看控制台！

原来是ES6中``的出现会代替()，涨知识了么

es6的字符串变成了 `` 1左边那个位置
${} 模版

学如逆水行舟，不进则退

关注