ES6之 模板字符串&字符串API（三）

• 模板字符串

  • 简化字符串的拼接，用反引号（ `` ）标识

    • 模板字符串必须用 `` 包含
    • 变化的部分使用${xxx}定义

  • 案例

    <script type="text/javascript">
    let obj = {
            name : 'anverson',
            age : 41
        };
    //传统写法：
    console.log('我叫:' + obj.name + ', 我的年龄是：' + obj.age);
    //ES6 新写法
    console.log(`我叫:${obj.name}, 我的年龄是：${obj.age}`);
    

  • 大括号内可以放入任意的JavaScript 表达式，可以进行运算，以及引用对象属性

    let x = 1;
    let y = 2;
    console.log(`${x} + ${y} = ${x + y}`);//1 + 2 = 3
    
    let obj2= {x: 1, y: 2};
    console.log(`${obj2.x + obj2.y}`); //3
    

  • 模板字符串中还能调用函数

    function fn() {
       return "Hello world";
    }
    console.log(`foo ${fn()} bat`);
    

• 字符串扩展

  • includes(str) : 判断是否包含指定的字符串
  • startsWith(str) : 判断是否以指定字符串开头
  • endsWith(str) : 判断是否以指定字符串结尾
  • repeat(count) : 重复指定次数

      let str = 'abcdefg';
      console.log(str.includes('a'));//true
      console.log(str.includes('h'));//false
  
      //startsWith(str) : 判断是否以指定字符串开头
      console.log(str.startsWith('a'));//true
      console.log(str.startsWith('d'));//false
      //endsWith(str) : 判断是否以指定字符串结尾
      console.log(str.endsWith('g'));//true
      console.log(str.endsWith('d'));//false
      //repeat(count) : 重复指定次数a
      console.log(str.repeat(5));