js中模板字符串的使用

作者: 绿芽 | 来源:发表于2021-10-18 10:02 被阅读0次

es6中增加了模板字符串,使字符的操作更加灵活和解决复杂的问题。
语法:
使用反引号( ` )来包裹普通字符串。如:

let message = `Hello world!`; 
console.log(message); // "Hello world!"
console.log(typeof message); // "string"
console.log(message.length); // 12

在模板字符串中可以将任何有效的 JS 表达式嵌入到模板字面量中,并将其结果输出为 字符串的一部分。如:

简单的变量替换

let name = "myName",
message = `Hello, ${ myName }.`; 
console.log(message); // "Hello, myName." 

复杂的表达式

let count = 10,
price = 0.25, 
message = `${count} items cost $${(count * price).toFixed(2)}.`;
console.log(message); // "10 items cost $2.50." 

相关文章

  • js中模板字符串的使用

    es6中增加了模板字符串,使字符的操作更加灵活和解决复杂的问题。语法:使用反引号( ` )来包裹普通字符串。如: ...

  • 模板引擎 easyTpl 的实现

    [TOC] 模板引擎 easyTpl 的实现 概述 项目中经常需要使用js模板去渲染字符串,像 handlebar...

  • 模板字符串

    title: 模板字符串date: 2016-11-21 15:04:36tags: [js] 模板字符串 模板字...

  • ES6(4)、新版字符串

    1、模板字符串 模板字符串使用反引号 (``) 来代替普通字符串中的用双引号和单引号。模板字符串可以包含特定语法(...

  • 模板引擎

    1.模板引擎:模板引擎编译成html,静态js,css; jade与pug同名 2.如何使用jade解析字符串: ...

  • vue 条件渲染

    v-if 在字符串模板中,如 Handlebars ,我们得像这样写一个条件块: 在 Vue.js ,我们使用 v...

  • Vue 模板语法

    模板语法概述 如何理解前端渲染?把数据填充到HTML标签中。 前端渲染方式(1)原生js拼接字符串(2)使用前端模...

  • JavaScript 模板字符串知识点归纳

    参考链接:模板字符串 换行 嵌入表达式 嵌套模板 在模板字符串内的 ${ } 占位符中,可以直接使用 ` 符号而无...

  • 前端模板引擎Handlebars的使用总结(二)

    一、Handlebars模板的转义问题 1.模板中当使用{{ }}时,转义,输出HTML字符串当使用{{{ }}}...

  • JS总结

    JS总结使用方法 1.Number 2.String 使用模板字符串 3.Array 拷贝数组使用扩展运算符 使用...

网友评论

    本文标题:js中模板字符串的使用

    本文链接:https://www.haomeiwen.com/subject/rongoltx.html