ES6--模板字符串
2023-06-13 09:12:46 时间
ES6中的模板字符串（template string）是增强版的字符串，用反引号（`）标识。它可以当作普通字符串使用，也可以用来定义多行字符串，或者在字符串中嵌入变量。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=\, initial-scale=1.0">
<title>Document</title>
<script src="https://unpkg.com/vue@3"></script>
</head>
<body>
<script>
//alert('a\nbc')
//var a =`123` //ES6的字符串
//alert(a)
var a=1
var b=2
var json={"leo":"abc"}
var abc=`<div>
<span>${a+b}${json.leo}
</span>
</div>`
console.log(abc)
</script>
</body>
</html>- 普通字符串
console.log(`好好学习 \n 天天向上`)2.多行字符串在编辑器中的换行，浏览器也会解析
console.log(`好好学习
天天向上`)3.字符串中嵌入变量
let name = "Bob", time = "today";
`Hello ${name}, how are you ${time}?`4.如果在模板字符串中需要使用反引号，则前面要用反斜杠转义。
console.log(`\`Hello\` world`)5.如果使用模板字符串表示多行字符串，所有的空格和缩进都会被保留在输出之中
let str = `<ul>
<li>Lancy</li>
<li>Michael</li>
<li>Cindy</li>
<li>Am</li>
</ul>`
console.log(str)
document.getElementById("result").innerHTML=str
6.模板字符串中嵌入变量，需要将变量名写在${}之中。大括号内部可放入任意的 JavaScript 表达式，可以进行运算，以及引用对象属性。
let x = 1;
let y = 2;
`${x} + ${y} = ${x + y}`7.模板字符串中可以调用函数。
function fn() { return "Hello World"; }
`foo ${fn()} bar`