ES6基础之字符串和函数的拓展详解

本文实例讲述了ES6基础之字符串和函数的拓展。分享给大家供大家参考，具体如下：

字符串的拓展

1.ES6为字符串添加了遍历器接口，因此可以使用for...of循环遍历字符串

2.字符串新增的 includes()、startsWith()、endsWidth() 三个方法用于判断某一字符串是否包含于另一字符串

3.新增 repeat() 方法， 该方法返回一个新字符串，不是对原字符串操作，表示将原字符串重复n次。

let str = 'abc';str.repeat(3) //abcabcabc str //abc

ps:该方法参数为正整数，如果为负数会报错，小数向下取整；

4.新增 padStart()，padEnd() 方法，用于补全字符串，该方法返回一个新字符串，不是对原字符串操作，传入两个参数，第一个参数用来指定字符串的最小长度，第二个参数是用来补全的字符串（缺省的话默认空格补全）。（ps：如果原字符串的长度，等于或大于指定的最小长度，则返回原字符串）；

let str = 'abc';str.padStart(2, 'abc') // 'abc'str.padEnd(2, 'abc') // 'abc'

5.模板字符串··（esc下面的那个按键），可以摆脱传统的字符串拼接的模式，直接将变量（表达式，对象的引用，函数等）写在模板字符串中输出

let str = 'world';let html = `hello ${str}`;html //hello wrold

ps：所有模板字符串的空格和换行，都是被保留的，可以使用trim方法消除换行。

6.标签模板，即模板字符串紧跟在一个函数名后面，该函数将被调用来处理这个模板字符串，这中方式被称为“标签模板”，“标签”指的就是函数，紧跟在后面的模板字符串就是它的参数

console.log `123`// 等同于console.log (123)

7.如果模板字符里面有变量，会将模板字符串先处理成多个参数，再调用函数;

var a = 5;var b = 10;function tag(s, v1, v2) { console.log(s) console.log(v1); console.log(v2);}tag`Hello ${ a + b } world ${ a * b }`;//['Hello','world','']//15//50

可以看出，tag函数第一个参数是一个数组，数组的成员是模板字符串中那些没有变量替换的部分，其他参数，都是模板字符串各个变量被替换后的值；

8.再来一个例子，看看标签模板的使用方法：

var total = 30;var msg = passthru`The total is ${total} (${total*1.05} with tax)`;function passthru(literals) { var result = ''; var i = 0; while (i < literals.length) {  result += literals[i++];  if (i < arguments.length) {   result += arguments[i];  } } return result;}