ES6标准入门 - 3. 字符串
字符串的遍历接口
- ES6为字符串添加了遍历器接口 使得字符串可以由
for...of
循环遍历 - 可以识别大于0xFFFF的码点 传统的for循环无法识别这样的码点
charAt() & at()
charAt()
方法返回字符串给定位置的字符 但是该方法不能识别码点大于0xFFFF的字符at()
方法可以识别Unicode编码大于0xFFFF的字符 该方法可以通过垫片库实现
确定一个字符串是否包含在另一个字符串
indexOf()
传统上js中只有这个方法可以来确定一个字符串是否包含在另一个字符串中- 但是ES6又提供了3种新方法:
include()
返回布尔值 表示是否找到了参数字符串startsWith()
返回布尔值 表示参数字符串是否在源字符串的头部endsWith()
返回布尔值 表示参数字符串是否在源字符串的尾部- 以上三个方法都接收第二个参数 来表示开始搜索的位置 但是
endsWith()
方法略有不同 表示该位置之前的字符
模板字符串
- ``
- 所有模板字符串的空格和换行都是被保留的 如果不想留用 可以使用
trim()
方法消除 - 模板字符串可以嵌套
- 变量使用方式:
${ 变量 }
- 变量可以是任意的js表达式 可以进行运算 以及引用对象属性 并且可以调用函数
- x / x+2 / obj.x + obj.y / fn()
- 如果大括号中的值不是字符串 则默认转换为字符串 如果是对象 则调用
toString()
方法 - 如果变量没有进行声明 则会报错
- 由于模板字符串中的大括号内部就是要执行的js代码 因此如果大括号内部是一个字符串 则会原样输出
模板编译
- <% ...放置js代码 %>
- <%= ...输出js代码 %>
标签模板
- alert
123
等同于alert(123)
- 紧跟在一个函数名后面 该函数将被调用来处理这个模板字符串
- 标签模板其实不是模板 而是调用函数的一种特殊形式 标签指的就是函数 紧跟在后面的模板字符串就是参数
- 如果模板字符中有变量 会将模板字符串先处理成多个参数 再调用函数
- 参数分别是:
- 第一个参数:没有变量替换的数组
- 第二个参数:有变量替换的参数
- 第三个参数:有变量替换的参数
- ...以此类推
- 标签模板的一个重要应用就是过滤HTML字符串,防止用户输入恶意内容
笔记内容整理来自阮一峰老师的《ES6标准入门》