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.padStartpadEnd一共接受两个参数,第一个参数用来指定字符串的最小长度,第二个参数是用来补全的字符串。

   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 字符串的扩展(待细读)的更多相关文章

  1. es6 字符串的扩展和数值的扩展

    es6字符串的扩展 1. es6新增的一些方法 1.1 includes 判断是否包括在内,返回一个 true or false 1.2 statsWith 判断是否以什么开头,返回一个 true o ...

  2. ES6字符串相关扩展

    变量的解构赋值 // 数组的解构赋值 let [a,b,c] = [1,2,3]; //1,2,3 let [a,b,c] = [,123,]; //undefined 123 undefined l ...

  3. es6字符串的扩展

    字符串的扩展 Unicode表示法:大括号包含表示Unicode字符(\u{0xXX}或\u{0XXX}) 字符串遍历:可通过for-of遍历字符串 字符串模板:可单行可多行可插入变量的增强版字符串 ...

  4. ES6 字符串的扩展

    字符的Unicode表示法 JavaScript允许采用\uXXXX形式表示一公分字符,其中XXXX表示字符的码点. "\u0061" //"a" 但是,这种表 ...

  5. es6字符串的扩展学习笔记

    1. 传统上,JavaScript只有indexOf方法,可以用来确定一个字符串是否包含在另一个字符串中.ES6又提供了三种新方法. includes():返回布尔值,表示是否找到了参数字符串. st ...

  6. es6字符串的扩展——模板

    todo1.模板字符串 传统的 JavaScript 语言,输出模板通常是这样写的(下面使用了 jQuery 的方法). $('#result').append( 'There are <b&g ...

  7. ES6 - 字符串的扩展(模版字符串)

    模板字面量的最简单语法,是使用反引号( `)(Tab上面那个键)来包裹普通字符串,而不是用双引号或单引号. <!DOCTYPE html> <html lang="en&q ...

  8. ES6模板字符串及字符串的扩展方法

    一.ES6模板字符串 传统定义字符串的方式是: const str='hello es2015,this is a string' ES6新增了一种定义字符串的方式用反引号进行标识 const str ...

  9. ES6走一波 字符串的扩展

    ES6字符串扩展: 处理大码点字符 字符的Unicode表示法 \uxxxx表示一个字符串,超出 \u0000 ~ \uffff范围,必须用两个双字节形式表示. ES6改进为 将码点放到大括号 可正确 ...

随机推荐

  1. Elasticsearch入门教程(六):Elasticsearch查询(二)

    原文:Elasticsearch入门教程(六):Elasticsearch查询(二) 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:h ...

  2. sql server if else

    DECLARE IF (@sex = '1')BEGIN PRINT '2'END ELSE BEGIN PRINT(1) END begin... end可以省略 declare @sex int ...

  3. django-Auth模块(详细介绍)

    转载自https://www.cnblogs.com/liuqingzheng/articles/9628105.html 1 Auth模块是什么 Auth模块是Django自带的用户认证模块: 我们 ...

  4. 数据绑定-绑定Servlet内置对象

    数据绑定:获取用户提交的参数,绑定到入参的参数中,就叫数据绑定. 绑定Servlet内置对象: 测试:

  5. VS 2005 \ 2008 "当前不会命中断点。源代码与原始版本不同"解决方法

    全选CPP文件内容, 选择 “编辑”-“高级”-“设置选定内容的格式”,保存,重新编译! 快捷键 ctrl + A 全选文件内容后 按 ctrl + K ,F OK!

  6. laravel 5.7 引入Illuminate\Http\Request 在类内调用 Request 提示不存在的问题

    laravel报错: ReflectionException Class App\Http\Controllers\Request does not exist 解决办法: namespace App ...

  7. 转载: Ubuntu 在命令下,安装中文环境的方法。

    转载: https://blog.csdn.net/zhangchao19890805/article/details/52743380 安装英文版ubuntu,在打开含有中文字符文件时会乱码,有需要 ...

  8. 使用OpenSSL生成RSA秘钥对并对文件加解密

    生成RSA私钥 openssl genrsa -out rsa.key 1024 生成RSA公钥 openssl rsa -in rsa.key -pubout -out pub.key 创建明文文件 ...

  9. layer单选框 radio的问题总结

    放官方文档: 位置 页面元素-表单:内置模块-表单属性title可自定义文本属性disabled开启禁用设置value="xxx"可自定义值,否则选中时返回的就是默认的onradi ...

  10. 3.1.2-arm-linux-ld选项

    有文件link.S,内容如下 .text .global _start _start: b step1 step1: ldr pc, =step2 step2: b step2 经过如下命令编译 ar ...