美文网首页
es6-字符串的扩展

es6-字符串的扩展

作者: 前端的爬行之旅 | 来源:发表于2018-09-05 15:51 被阅读13次

1. indexOf === includes(), endsWith(), startsWith()

  • includes():返回布尔值,表示是否找到了参数字符串。
  • startsWith():返回布尔值,表示参数字符串是否在原字符串的头部。
  • endsWith():返回布尔值,表示参数字符串是否在原字符串的尾部。
let s = 'Hello world!';

s.startsWith('Hello') // true
s.endsWith('!') // true
s.includes('o') // true

这三个方法都支持第二个参数,表示开始搜索的位置。

let s = 'Hello world!';

s.startsWith('world', 6) // true
s.endsWith('Hello', 5) // true
s.includes('Hello', 6) // false

上面代码表示,使用第二个参数n时,endsWith的行为与其他两个方法有所不同。它针对前n个字符,而其他两个方法针对从第n个位置直到字符串结束。

2.repeat()

repeat方法返回一个新字符串,表示将原字符串重复n次。

'x'.repeat(3) // "xxx"
'hello'.repeat(2) // "hellohello"
'na'.repeat(0) // ""

参数如果是小数,会被取整。

'na'.repeat(2.9) // "nana"

如果repeat的参数是负数或者Infinity,会报错。

'na'.repeat(Infinity)
// RangeError
'na'.repeat(-1)
// RangeError

但是,如果参数是 0 到-1 之间的小数,则等同于 0,这是因为会先进行取整运算。0 到-1 之间的小数,取整以后等于-0,repeat视同为 0。

'na'.repeat(-0.9) // ""

参数NaN等同于 0。

'na'.repeat(NaN) // ""

如果repeat的参数是字符串,则会先转换成数字。

'na'.repeat('na') // ""
'na'.repeat('3') // "nanana"

3.padStart(),padEnd()

padStart()用于头部补全,padEnd()用于尾部补全。
默认为两个参数,第一个参数:字符串的长度,部位字符,默认为空。

'x'.padStart(5, 'ab') // 'ababx'
'x'.padStart(4, 'ab') // 'abax'

'x'.padEnd(5, 'ab') // 'xabab'
'x'.padEnd(4, 'ab') // 'xaba'

'x'.padStart(4) // '   x'
'x'.padEnd(4) // 'x   '

如果原字符串的长度,等于或大于指定的最小长度,则返回原字符串。

3.模版字符串

// 字符串中嵌入变量
let name = "Bob", time = "today";
`Hello ${name}, how are you ${time}?`

如果使用模板字符串表示多行字符串,所有的空格和缩进都会被保留在输出之中。

$('#list').html(`
<ul>
  <li>first</li>
  <li>second</li>
</ul>
`);

上面代码中,所有模板字符串的空格和换行,都是被保留的,比如<ul>标签前面会有一个换行。如果你不想要这个换行,可以使用trim方法消除它。

$('#list').html(`
<ul>
  <li>first</li>
  <li>second</li>
</ul>
`.trim());

相关文章

  • es6-字符串扩展

    字符串新增特性 Unicode表示法 遍历接口 模板字符串 新增方法 babel-polifill 兼容 es7 ...

  • ES6-字符串扩展

    (1)for···of循环。ps:可以使用break,找到合适的值后不再执行后面的循环,若想获得下标,可使用for...

  • es6-字符串扩展

    1:字符的Unicode表示法 2:字符串的遍历器接口 3:直接输入U + 2028 和 u + 2029 4:J...

  • es6-字符串的扩展

    1. indexOf === includes(), endsWith(), startsWith() inclu...

  • ES6扩展

    字符串扩展 正则扩展 数值扩展 函数扩展 对象扩展 数组扩展 字符串扩展 模版字符串 部分新的方法 padStar...

  • ES6-字符串和正则表达式

    title: ES6-字符串和正则表达式date: 2018-01-30 22:15:59tags: es6 前言...

  • 2019-01-24

    ES6-之 filter

  • ES6-函数的扩展

    函数的参数默认值 使用参数默认值时,函数不能有同名参数。在函数体内,不能使用let/const再声明与参数同名的变...

  • es6-数值的扩展

    1.Number.isFinite()和Number.isNaN() Number.isFinite()用来检查一...

  • ES6-对象的扩展

    对象的传统表示法 我们回顾一下,对象的传统表示法: 上面的案例很简单,变量person就是一个对象,对象含有nam...

网友评论

      本文标题:es6-字符串的扩展

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