ES6 字符串的扩展(待细读)
1.确定字符串中是否含有某个字符串
- indexof(value,num):可返回某个指定的字符串值在字符串中首次出现的位置。ES5方法,num范围(0~length-1)
- includes(value,num):返回布尔值,表示是否找到了参数字符串。
- startsWith(value,num):返回布尔值,表示参数字符串是否在原字符串的头部。
- endsWith(value,num):返回布尔值,表示参数字符串是否在原字符串的尾部。
let str="Hello world!";
indexof("l",1);//
str.startsWith('world', 6) // true
str.endsWith('Hello', 5) // true
str.includes('Hello', 6) // false
使用第二个参数n时,endsWith的行为与其他两个方法有所不同。它针对前n个字符,而其他三个方法针对从第n个位置直到字符串结束。
2.repeat()
repeat方法返回一个新字符串,表示将原字符串重复n次。
'x'.repeat(3);//xxx
a.如果参数为小数,则取整
'x'.repeat(2.9);//xx
b.如果参数是负数或者Infinity(即无穷大),会报错
"x".repeat(-1);RangError
c.如果参数是0到-1之间的小数,取整以后等于-0,repeat视同为0
“x”.repeat(-0.9);//""
d.参数NAN等同0
“x”.repeat(NAN);//""
e.如果参数是祖父穿,则会先转换成数字
"x".repeat("3a");//""
"x".repeat("a3");//""
3.padStart(),padEnd();
ES2017 引入了字符串补全长度的功能。如果某个字符串不够指定长度,会在头部或尾部补全。padStart()用于头部补全,padEnd()用于尾部补全。
规则:a.padStart和padEnd一共接受两个参数,第一个参数用来指定字符串的最小长度,第二个参数是用来补全的字符串。
b.如果原字符串的长度,等于或大于指定的最小长度,则返回原字符串。
c.如果用来补全的字符串与原字符串,两者的长度之和超过了指定的最小长度,则会截去超出位数的补全字符串。
d.如果省略第二个参数,默认使用空格补全长度。
a.
'x'.padStart(5, 'ab') // 'ababx'
'x'.padStart(4, 'ab') // 'abax' 'x'.padEnd(5, 'ab') // 'xabab'
'x'.padEnd(4, 'ab') // 'xaba' b.
'xxx'.padStart(2, 'ab') // 'xxx'
'xxx'.padEnd(2, 'ab') // 'xxx'
c.
'abc'.padStart(10, '0123456789')
// '0123456abc'
d.
'x'.padStart(4) // ' x'
'x'.padEnd(4) // 'x '
主要用途:(1).padStart的常见用途是为数值补全指定位数。下面代码生成 10 位的数值字符串。
'1'.padStart(10, '0') // "0000000001"
'12'.padStart(10, '0') // "0000000012"
'123456'.padStart(10, '0') // "0000123456"
(2).另一个用途是提示字符串格式。
'12'.padStart(10, 'YYYY-MM-DD') // "YYYY-MM-12"
'09-12'.padStart(10, 'YYYY-MM-DD') // "YYYY-09-12"
3.模板字符串(template string)
如果使用模板字符串表示多行字符串,所有的空格和缩进都会被保留在输出之中。
$('#list').html(`
<ul>
<li>first</li>
<li>second</li>
</ul>
`);
上面代码中,所有模板字符串的空格和换行,都是被保留的,比如<ul>标签前面会有一个换行。如果你不想要这个换行,可以使用trim方法消除它。
$('#list').html(`
<ul>
<li>first</li>
<li>second</li>
</ul>
`.trim());
模板字符串甚至还能嵌套。
const tmpl = addrs => `
<table>
${addrs.map(addr => `
<tr><td>${addr.first}</td></tr>
<tr><td>${addr.last}</td></tr>
`).join('')}
</table>
`;
如果需要引用模板字符串本身,在需要时执行,可以像下面这样写。
// 写法一
let str = 'return ' + '`Hello ${name}!`';
let func = new Function('name', str);
func('Jack') // "Hello Jack!" // 写法二
let str = '(name) => `Hello ${name}!`';
let func = eval.call(null, str);
func('Jack') // "Hello Jack!"
4.未完待续
ES6 字符串的扩展(待细读)的更多相关文章
- es6 字符串的扩展和数值的扩展
es6字符串的扩展 1. es6新增的一些方法 1.1 includes 判断是否包括在内,返回一个 true or false 1.2 statsWith 判断是否以什么开头,返回一个 true o ...
- ES6字符串相关扩展
变量的解构赋值 // 数组的解构赋值 let [a,b,c] = [1,2,3]; //1,2,3 let [a,b,c] = [,123,]; //undefined 123 undefined l ...
- es6字符串的扩展
字符串的扩展 Unicode表示法:大括号包含表示Unicode字符(\u{0xXX}或\u{0XXX}) 字符串遍历:可通过for-of遍历字符串 字符串模板:可单行可多行可插入变量的增强版字符串 ...
- ES6 字符串的扩展
字符的Unicode表示法 JavaScript允许采用\uXXXX形式表示一公分字符,其中XXXX表示字符的码点. "\u0061" //"a" 但是,这种表 ...
- es6字符串的扩展学习笔记
1. 传统上,JavaScript只有indexOf方法,可以用来确定一个字符串是否包含在另一个字符串中.ES6又提供了三种新方法. includes():返回布尔值,表示是否找到了参数字符串. st ...
- es6字符串的扩展——模板
todo1.模板字符串 传统的 JavaScript 语言,输出模板通常是这样写的(下面使用了 jQuery 的方法). $('#result').append( 'There are <b&g ...
- ES6 - 字符串的扩展(模版字符串)
模板字面量的最简单语法,是使用反引号( `)(Tab上面那个键)来包裹普通字符串,而不是用双引号或单引号. <!DOCTYPE html> <html lang="en&q ...
- ES6模板字符串及字符串的扩展方法
一.ES6模板字符串 传统定义字符串的方式是: const str='hello es2015,this is a string' ES6新增了一种定义字符串的方式用反引号进行标识 const str ...
- ES6走一波 字符串的扩展
ES6字符串扩展: 处理大码点字符 字符的Unicode表示法 \uxxxx表示一个字符串,超出 \u0000 ~ \uffff范围,必须用两个双字节形式表示. ES6改进为 将码点放到大括号 可正确 ...
随机推荐
- Git复习(九)之理解git工作区和暂存区
前言 Git和其他版本控制系统如SVN的一个不同之处就是有暂存区的概念. 版本库 在工作区目录中有一个.git文件,这个其实不是工作区而是Git的版本库 版本库中包含两个部分,一个是暂存区index/ ...
- QuickSort(快排)的JAVA实现
QuickSort的JAVA实现 这是一篇算法课程的复习笔记 用JAVA对快排又实现了一遍. 先实现的是那个easy版的,每次选的排序轴都是数组的最后一个: package com.algorithm ...
- O001、写在最前面
参考https://www.cnblogs.com/CloudMan6/p/5224114.html <每天5分钟玩转 OpenStack> 1.系统讲解 OpenStac ...
- 06 基本数据结构 - 双端队列(Deque)
一.双端队列(Deque) - 概念:deque(也称为双端队列)是与队列类似的项的有序集合.它有两个端部,首部和尾部,并且项在集合中保持不变. - 特性:deque 特殊之处在于添加和删除项是非限制 ...
- 彻底了解websocket原理
一.websocket与http WebSocket是HTML5出的东西(协议),也就是说HTTP协议没有变化,或者说没关系,但HTTP是不支持持久连接的(长连接,循环连接的不算) 首先HTTP有 1 ...
- webpack 打包 UglifyJs 报错
Vue-cli 打包报错: ERROR in static/js/4.784ab4a1238de8e94312.js from UglifyJs Unexpected token: 原因:Uglify ...
- Ubuntu - 14.04下,GO语言的安装!
一,下载GO语言的安装文件,我直接下载GO语言的安装包(64位),并不是源码: 下载地址: 64位:https://storage.googleapis.com/golang/go1.6.linux- ...
- vue配置路由时报错 Error in render: "RangeError: Maximum call stack size exceeded"
虽然标题写的是配置路由报错,最终也是通过修改路由解决的,但是导致报错的还有一个主要因素,是因为我增加了一个功能“页面刷新时,根据url高亮左侧导航”,如下图: 1.页面刷新,根据url高亮左侧导航代码 ...
- 腾讯地图JSAPI开发demo 定位,查询
1.IP定位切换 2.点击坐标获取地点 3.查询地点切换坐标 <!DOCTYPE html> <html> <head> <meta http-equiv=& ...
- springboot启动端口占用问题,报错org.apache.catalina.LifecycleException: Protocol handler start failed
解决办法,找到被占用的端口