ES6标签模板字符串

55 阅读1分钟

ES6:标签模板字符串

1.模板字符串的基本使用

const name = 'tony'

const age = 18

const str = `my name is ${name}, age is ${age}`

console.log(str);

2.标签模板字符串的使用

函数后跟上模板字符串相当于以模板字符串里的内容作为参数在执行函数

他会将每一个动态插入的位置做一个字符串的截取,例如这里他会截取动态部分name,{name},{age}

最终拆成 ['my name is ', ', age is ', ''] 这三部分,然后将这三部分传入一个数组中,作为调用foo函数的第一个参数,

然后分别将动态部分name的数据,{name}的数据,{age}的数据作为调用foo函数的第二,第三个参数

// 先定义一个函数 参数为剩余参数(接收时参数会被集合成一个数组)
const name = 'tony'

const age = 18

function foo(...args) {

 console.log(args);

}

foo('tony', 18)


foo`my name is ${name}, age is ${age}`

// 通过模板字符串执行foo的最终打印结果:[['my name is ', ', age is ', '',], 'tony', 18]