模板字面量

模板字面量

ES6新增使用模板字面量定义字符串的能力，保留换行字符，可以跨行定义字符串

let str = 'hello\nworld';//这里的换行符也可以直接是换行
//例如(但是声明字符串的方式		[` 	`]	)
let str = `hello
world`;           //这里前面只能定格写，不然会计算前面的空格
console.log.log(str);  
//hello
//world

字符串插值

可以在一个连续的定义中插入一个或多个值，任何插入的变量也会在他们最近的作用域中取值

字符串插值通过

在  ${ }   中使用一个JavaScript表达式实现
以前通用的字符串插入方式是利用 + 连接符实现
例如 let s1 = "hello";
	let s2 = "world";
//连接两个字符：let s = s1 +" " + s2 + " " + " ! ";
//hello world !
利用模板字面量
s = `${s1} ${s2} ${"!"}` //这里的感叹号不需要转义
//hello world !
 ${ }大括号中可以添加任何JavaScript表达式，可以调用函数，也可以插入自己之前的值,外面必须是 ` ` 符号

模板字面量标签函数

可以通过标签函数自定义插值行为。标签函数的参数分别依次是原始字符串数组和对每个表达式求值的结果，函数返回值是对这个模板字面量求值得到的字符串。

let a = 6;
let b = 10;

function s(str, av, bv, sum) {
    console.log(str);//这里的第一个参数是指去掉strr中的${}后的字符串，所以这里是"" , "+" , "=" , ""
    console.log(av);//这里是传进来的第一个${}值，如这里是6
    console.log(bv);
    console.log(sum);//这里是传进去的参数的表达式的结果，如表达式是+，则执行结果就是av 和 bv相加的值 
    return "foobar";//返回的字符串
}
let strr = `${ a } + ${ b } = ${ a + b }`;
let fina = s `${ a } + ${ b } = ${ a + b }`;//语法就是标签函数跟原始值strr
console.log(strr);
console.log(fina);

原始字符串

使用模板字面量可以直接获取到原始的模板字面量内容（如换行符合和Unicode字符），而不是转义之后的字符

使用string.raw标签函数
//例如
//\u00A9     这是版权符号
//如果直接使用模板字面量
console.log(`\u00A9`);   //输出©
//使用string.raw标签函数
console.log(string.raw`\u00A9`);     //输出  \u00A9
//还会忽略换行符
console.log(hello/world);     //输出hello\nworld