ES6_字符串模板以及其使用

• 之前的字符串拼接:

  •   <script >
          // 这样拼接的很累
          let name = "Strive";
          let age = 18;
          let str = '这个人叫' + name + ',年龄是' + age + '岁';
          console.log(str);
      </script>
    

  • 现在使用字符串模板:

    • <script>
          // 注意:字符串模板中,包裹字符串的符号是Esc下面的 ` ,对于要替换的字符串,使用 ${} 进行替换
          let name = "Strive";
          let age = 18;
          let str = `这个人叫${name},年龄是${age}岁`;
          console.log(str);
      </script>
      

字符串模板优点:可以随意换行

关于字符串的查找:

• 之前使用:indexof(),例如:

  • indexof() 返回的是索引位置,如果没有该str,返回-1

  • <script >
        let str = "apple banana pear";
           console.log(str.indexOf('apple'));
           if (str.indexOf('apple') !== -1) {
               alert("有");
           } else {
               alert("无");
           }
    </script>
    

• 而现在可以使用includes(),例如:

  • includes() 返回true / false

  •        <script >
               let str = "apple banana pear";
               console.log(str.includes('apple'));
           </script>
    

• 判断字符串以何开头或结尾

  • 开头:startsWith()

    • <script >
          let str = "applebananapurper";
          // console.log(str.startsWith("apple"));
          console.log(str.startsWith("banana"));
      </script>
      

  • 结尾:endsWith()

    • <script >
        //endsWith() 用以判断str是否以某一字符串结尾,注意传入的字符串为正序
        let str2 = "aggasdhglajsgblahdg;jgfkjhbadlifjas";
        console.log(str2.endsWith('as'));
      </script>
      

• 字符串的重复:repeat()

  • 将字符串重复n次输出,输入负数报错,并不会改变原来的str

  • 而且它并不会改变原来str的值,如:

    • <script >
        let str = "abcdefa";
            // 将字符串重复n次输出,输入负数报错,并不会改变原来的str
            console.log(str.repeat(10));
            console.log(str);
      </script>
      

• 字符串的填充:padStart() / padEnd()

  • str.padStart(num,“str2”);

  • str用str2填充,重复str2,直到str+str2重复n次=num

  • 它并不会改变str的值,如:

    • <script >
        let str = "abc";
                let str2 = str.padStart(10, "你好");
                console.log(str2);
                console.log(str);
      </script>
      

  • 关于它的使用:

    • 如果想拼接str1,str2,并且不知道他们的总length,可以使用:

    • <script >
        let str = "a";
            let str2 = "STR";
            // 将两个字符串拼接在一起(不用就知道length)
            console.log(str.padStart(str.length + str2.length, str2));
      </script>
      

  • panEnd()也是如此