ES6学习之ES5之后新增的字符串方法

Posted 2020-11-21 heheblog

1.字符串模板：用法：`${变量名}`　　　（好像是C#6.0中也引入了类似的方法。C#中的用法：$"我是{变量名}" ---> $"我叫{name}" ，相当于string.Format() ）

    //ES6中字符串新的连接的方式 --->字符串模板
        let name = "小样儿",
            age = 18;
        let str = `我叫${name},今年${age}岁！`
        console.log(str);    //我叫小样儿,今年18岁！

View Code

字符串模板还是还很有用的，方便了我们拼接字符串，以往的 ‘ + name + ‘ 方式拼接起来很费劲，而且隔行还得+，很是麻烦

2.字符串查找方法： string.includes(‘要找得字符串‘)，返回 布尔值　　ps：区分大小写

        let str = "呵呵哒哈哈哈1额额额";
        console.log(str.includes("呵呵"));    //true

View Code

利用includes检查用户使用的浏览器

if (navigator.userAgent.includes(‘Chrome‘)) {
            console.log("是谷歌浏览器");
        } else {
            console.log("不是谷歌浏览器");
        }

View Code

3.检查字符串是否已xxx开头---》string.startsWith("要检查的字符串")，检查字符串是否以xxx结尾---》string.endsWith("要检查的字符串")　　两者返回的都是bool

 

{
        //检查字符串是否以XXX开头   --->string.startsWith("要检查的字符串")   返回值bool
        let urlstr = "http://www.baidu.com";
        let urlstr1 = "file:///C:/Users/xxx.html";
        console.log(urlstr.startsWith("https://"));    //false
        console.log(urlstr1.startsWith("file://"))        //true
    }
    {
        //检查字符串是否以XXX结尾   --->string.endsWith("要检查的字符串")   返回值bool
        let urlstr = "http://www.baidu.com";
        console.log(urlstr.endsWith("baidu.com"));
        let path = "111.jpg";
        console.log(path.endsWith(".png"));
    }

View Code

 

4.字符串重复方法---》string.repeat(次数)

     //字符串重复    ---》string.repeat(次数)；
        let str = "小样儿";
        console.log(str.repeat(10));     //小样儿小样儿小样儿小样儿小样儿小样儿小样儿小样儿小样儿小样儿

//会输出十次            ---》感觉没什么用处

View Code

5.字符串填充 --->string.padStart(整个字符串的长度,"需要填充的字符串") 往字符串前面填充（在字符串前面插入字符串），string.padEnd(整个字符串的长度,"需要填充的字符串") 往字符串后面填充（在字符串后面插入字符串）

        let str = "Iphone";
        let padStr = "我的";
        console.log(str.padStart(str.length + padStr.length, padStr));//我的Iphone

        let iphone = "Iphone";    
        let endStr = "10";    
        console.log(iphone.padEnd(iphone.length + endStr.length, endStr));    //Iphone10

View Code