ES6 - 字符串的扩展(模版字符串)
模板字面量的最简单语法,是使用反引号( `)(Tab上面那个键)来包裹普通字符串,而不是用双引号或单引号。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div id="template">
</div>
</body>
<script>
//变量
let name = "Nicholas";
//方法
function makeUpperCase(word) {
return word.toUpperCase();
}
let element = `
<div>
Hello, ${name}
</div>
<ul>
<li>1.${makeUpperCase('tell me!')}</li>
<li>2.call me!~</li>
</ul>
`.trim();
document.getElementById("template").innerHTML = element;
</script>
</html>
ES6 - 字符串的扩展(模版字符串)的更多相关文章
- ES6箭头函数及模版字符串
var f = v => v; 等同于: var f = function(v) { return v; }; 箭头函数可以与变量解构结合使用: const full = ({ first, l ...
- ES6之模版字符串
ES6之模版字符串 最近在项目中使用了ES6的模版字符串,在这里加以总结. 1.之前我们也可以使用JavaScript输出模版字符串,通常是下面这样的: $("#result"). ...
- ES6 模版字符串及常用的es6扩展方法
1.ES6 模版字符串es6 模版字符串主要用于简化字符串的拼接 <script type="text/javascript"> let obj={name:'rdb' ...
- es6 字符串的扩展和数值的扩展
es6字符串的扩展 1. es6新增的一些方法 1.1 includes 判断是否包括在内,返回一个 true or false 1.2 statsWith 判断是否以什么开头,返回一个 true o ...
- ES6的新特性(4)——字符串的扩展
字符串的扩展 ES6 加强了对 Unicode 的支持,并且扩展了字符串对象. 字符的 Unicode 表示法 JavaScript 允许采用\uxxxx形式表示一个字在\u0000~\uFFFF之间 ...
- es6中的模版字符串
目录 字符串拼接 includes() startsWith() endsWith() padStart() es6中的模版字符串替代了原有的字符串拼接功能. 字符串拼接 es5方式 传统的字符串拼接 ...
- ES6学习笔记(3)----字符串的扩展
参考书<ECMAScript 6入门>http://es6.ruanyifeng.com/ 字符串的扩展ES6之前只能识别\u0000 - \uFFFF 之间的字符,超过此范围,识别会出错 ...
- ES6学习历程(字符串的扩展)
字符串的扩展 在看这一节的时候前半部分写的都是关于unicode的内容,我个人感觉这部分在实际的开发中用的很少,所以不打算在做记录,等届时用到再有针对性的看,所以就将在ES6里面关于字符串操作的一些新 ...
- ES6学习笔记(三)字符串的扩展
ES6 加强了对 Unicode 的支持,并且扩展了字符串对象. 1.字符的Unicode表示法 JavaScript 允许采用\uxxxx形式表示一个字符,其中xxxx表示字符的 Unicode 码 ...
- 字符串的扩展(ES6)
文章目录 字符串的扩展 1. 字符的Unicode表示法 2. codePointAt() 3. String.fromCodePoint() 4. 字符串的遍历器接口 5. at()(提案) 6. ...
随机推荐
- Django 初始化数据库遇到问题(python manage.py migrate)
问题:django.db.utils.InternalError: (1049, "Unknown database 'main'") 在Django 配置的数据库上 执行 cr ...
- php日期格式化方法详解
php日期格式化一般使用date()来完成,此函数的声明及定义如下图所示,其参数有很多,这里按常用的年.月.日.时.分.秒.星期来简单介绍. date(format,timestamp) 一.年.月. ...
- 浅谈Python设计模式 - 外观模式
声明:本系列文章主要参考<精通Python设计模式>一书,并且参考一些资料,结合自己的一些看法来总结而来. 外观模式 外观模式的核心在于将复杂的内部实现包装起来,只向外界提供简单的调用接口 ...
- 带你快速上手前端三剑客之css
CSS介绍 CSS(Cascading Style Sheet , 层叠样式表)定义如何显示HTML元素.当浏览器读到一个样式表,它就会按照这个样式表来对文档进行格式化(渲染) 组成 每个CS ...
- Java 中函数式编程方法形参为基本类型和引用类型
简单复习下 基本数据类型值传递 值传递,原变量的值不会被修改 private final Consumer sout = System.out::println; @Before public voi ...
- ‘cmake' 不是内部或外部命令 也不是可运行的程序 或批处理文
在 Win7下的命令行模式下,输入cmake相关命令,出现如下错误: ’cmake' 不是内部或外部命令 也不是可运行的程序 或批处理文件 解决方法: 在环境变量中添加cmake的文件路径. 计算机( ...
- js动画--一个小bug处理下
对于上面的课程我们很好的处理了一个小bug,那么我们现在讲程序进行优化一下,前一节的程序中,我们处理处理的属性都是写死了的.为了我们能够很好的对某个属性进行操作的话.我们这样来设置. js文件 win ...
- Scrapy爬虫案例 | 数据存储至MySQL
首先,MySQL创建好数据库和表 然后编写各个模块 item.py import scrapy class JianliItem(scrapy.Item): name = scrapy.Field() ...
- Scrapy爬虫案例 | 数据存储至MongoDB
豆瓣电影TOP 250网址 要求: 1.爬取豆瓣top 250电影名字.演员列表.评分和简介 2.设置随机UserAgent和Proxy 3.爬取到的数据保存到MongoDB数据库 items.py ...
- Xamarin NuGet 缓存包导致 already added : Landroid/support/annotation/AnimRes 问题解决方案
在VS中打开您遇到问题的解决方案. 转到工具> NuGet包管理器>包管理器设置 - >常规,然后点击“清除所有NuGet缓存” 这应该返回一个错误,因为你有一个项目打开,但如果没有 ...