美文网首页ES6
3. 字符串的扩展

3. 字符串的扩展

作者: 羊烊羴 | 来源:发表于2018-01-11 15:11 被阅读0次

字符串的遍历接口

ES6为字符串添加了遍历器接口,使得字符串可被for..of循环遍历

let str='hello';

for(let code of str){
    console.log(code);
}//'h','e','l','l','o'

for...of遍历字符串可以识别大于0xffff的码点,而传统的for循环遍历无法识别这样的码点

includes(),startsWidth(),endsWith()

includes()返回布尔值,表示是否找到了参数的字符串

startsWith()返回布尔值,表示参数是否在源字符串的头部

endsWith返回布尔值,表示参数是否在源字符串的尾部

以上三个方法都支持第二个参数,用于表示开始搜索的位置

const str="hello world";
console.log(str.includes("d",3)); //true
console.log(str.endsWith("o",5)); //true
console.log(str.startsWith("l",3)); //true

//三个方法有一些不同的地方在于,在传入第二个参数的情况下,endsWith从第二个参数的位置开始向前查找,其余两个方法是从第二个参数开始的位置向后查找

repeat

该方法会返回一个新的字符串,用于表示将原来的字符串重复了多少次

const str="hello";
console.log(str.repeat(3.9)); //hellohellohello
console.log(str.repeat(0)); //""

//如果传入的参数为小数,那么会转换为整数进行转换,转换规则会按照地板函数来取整,如果参数是负数或Infinity会报错,参数为NAN视为0,如果参数是字符串会先转换为数字再进行操作

padStart(),padEnd()

这两个方法用于补全字符串,padStart用来在头部补全,padEnd用来在尾部补全

const str="hello";
console.log(str.padStart(8, "world")); //worhello
console.log(str.padEnd(10, "world")); //hellowworld

//第一个参数表示补全后字符串的长度,第二个参数表示要对源字符串补全的字符串,如果源字符串的长度大于该值,返回源字符串,如果小于该值那么对字符串进行补全,如果补全字符串和源字符串之和大于设定的值,那么会截去超出位数的补全字符,如果不设定第二个参数,那么默认使用空格进行补全

利用这两个补全方法,可以实现生成指定位数或提示字符串格式

console.log("1".padStart(10, "0")); //0000000001
console.log("9-12".padStart(10, "YYYY-MM-DD")); //YYYY-M9-12

模板字符串

模板字符串是增强版的字符串,用`标识,它可以当作普通字符串使用,也可以用来定义多行字符串,或在字符中嵌入变量

"hello world \n -javascript"
`hello world
                JavaScript`
                
//在使用普通字符串时我们想要实现换行效果,需要使用\n ,而在模板字符串中,我们只要按照书写格式进行换行即可,在模板字符串中所有的换行和空格都会被保留

var name="Tom";
console.log(`name is ${name}`);

var obj={one:1,two:2};
console.log(`${obj.one + obj.two}`);

function  fn() {
       return "hello world"
}
console.log(`say:${fn()}`);
//模板字符串可以直接嵌入变量,变量使用${}进行包裹,在大括号内可以放入任意的javasccript表达式,可以进行运算,以及对象属性的引用,也可以直接引用构造函数

//如过{}内不是字符串,将会按照一般的规范进行转义,例如如果是一个对象,,将会默认调用对象的toStrin方法,如果引用的变量没有声明,那么会报错,如果是字符会直接输出该字符串内容

//模板字符串可以进行嵌套

相关文章

  • 六:前段笔记(3)

    1.字符串扩展 2.数值的扩展 3.数组的扩展 4.对象的深度克隆

  • ES6 字符串、数组、函数、对象

    字符串 1. 多行字符串 2. 字符串模板 数组 1. 扩展 2. 函数参数的扩展 3. 类数组对象转数组 函数 ...

  • 3. 字符串的扩展

    字符串的遍历接口 ES6为字符串添加了遍历器接口,使得字符串可被for..of循环遍历 for...of遍历字符串...

  • 3.字符串的扩展

    回到目录 ES6 新增 api 例子 上面代码表示,使用第二个参数 n 时,endsWith 的行为与其他两个方法...

  • ES6 语法总结

    1. let,const关键词 2. 结构赋值 3. 正则扩展 4. 字符串扩展 5. 数值扩展 6. 数组扩展 ...

  • Swift3常用工具类方法

    1.扩展图片 2.扩展颜色 3.扩展字符串 4.计算字符串高度 5.时间转换星期 5.金额单位转换 6.字节单位转换

  • ES6扩展

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

  • ES6 学习笔记--------目录

    1.let 和 const 命令 2.变量的解构赋值 3.字符串的扩展 4.正则的扩展 5.数值的扩展 6.函数的...

  • 前端小白成长03--小知识点 字符串 参数 展开数组

    1.模板字符串可以\转义 2.可以换行 3.把js片段输出,不用+号拼接 带标签的模板字符串 字符串的扩展方法 i...

  • 2017-12-26es6-函数扩展

    扩展 1、字符串扩展 2、模板字符串 **** 3、数值扩展 4、函数扩展用于分页居多 rest 参数 ...变量...

网友评论

    本文标题:3. 字符串的扩展

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