ES6标准入门

字符串的遍历接口

• 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代码 %>

标签模板

• alert123 等同于 alert(123)
• 紧跟在一个函数名后面 该函数将被调用来处理这个模板字符串
• 标签模板其实不是模板 而是调用函数的一种特殊形式 标签指的就是函数 紧跟在后面的模板字符串就是参数
• 如果模板字符中有变量 会将模板字符串先处理成多个参数 再调用函数
  • 参数分别是：
  • 第一个参数：没有变量替换的数组
  • 第二个参数：有变量替换的参数
  • 第三个参数：有变量替换的参数
  • ...以此类推
• 标签模板的一个重要应用就是过滤HTML字符串，防止用户输入恶意内容

笔记内容整理来自阮一峰老师的《ES6标准入门》