Web 前端开发

字符串String(es6(ECMAScript2015))

2018-06-27  本文已影响3人  魔幻空城

//网址来自MDN

    //String.prototype 属性表示 String原型对象。

//模板字符串

    let name = 'Jack';

    let occupation = "doctor";


    //传统字符串拼接

    //let str = "He is "+ name +",he is a "+ occupation;


    //模板字符串拼接

    let str = `He is ${name},he is a ${occupation}`;


 //${ }

    //开发过程中,经常用到jq为元素动态添加子元素或动态添加内容,过去我们都是通过字符串拼接进行添加变量。

    //ES6添加的 可以很好的取代jq的老方法,单引号加上'${}'不仅可以嵌入变量,还能保持代码格式,并且{}里面可以进行js代码运行。


    //标签模板

    var name1 = "张三";

    var height = 1.8;

    tagFn `他叫${name1},身高${height}米。`;


    //标签+模板字符串

    //定义一个函数,作为标签

    function tagFn(arr, v1, v2) {

        console.log(arr);

        //结果:["他叫", ",身高", "米。"]

        console.log(v1);

        //结果:张三

        console.log(v2);

        //结果:1.8

    }


    //repeat()方法  包含指定字符串的指定数量副本的新字符串。repeat是一个通用方法,也就是它的调用者可以不是一个字符串对象.

    let name2 = 'hello!'

    let name3 = name2.repeat(3);

    console.log(name3) //返回值  hello!hello!hello!

    //此方法已添加到ECMAScript 2015规范中,并且可能尚未在所有JavaScript实现中可用。然而,你可以使用以下代码段对 String.prototype.repeat() 进行填充:

    //https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/repeat

    //includes()方法    这个方法可以帮你判断一个字符串是否包含另外一个字符串。

    var name4 = "赵钱孙李周吴郑王冯陈褚卫蒋沈韩杨"; //目标字符串

    console.log(name4.includes('赵')) //返回值  true,含有

    console.log(name4.includes('胡')); //返回值  false,不含有

    console.log(name4.includes('吴', 5)) //返回值  true,含有

    console.log(name4.includes('吴', 4, 5)) //返回值  true,含有

    console.log(name4.includes('吴', 3, 8)) //返回值  true,含有

    //String.includes(str,start(可选),end(可选))start(包括本身)end(包括本身)

    //这个方法已经被加入到 ECMAScript 6 标准中,但未必在所有的 JavaScript 实现中都可以使用。然而,你可以轻松地polyfill这个方法:

    {

        if (!String.prototype.includes) {

            String.prototype.includes = function (search, start) {

                'use strict';

                if (typeof start !== 'number') {

                    start = 0;

                }

                if (start + search.length > this.length) {

                    return false;

                } else {

                    return this.indexOf(search, start) !== -1;

                }

            };

        }

    }


    //startsWith()方法  用来判断当前字符串是否是以另外一个给定的子字符串“开头”的,根据判断结果返回 true 或 false

    console.log(name4.startsWith('赵')); //返回值  true,第一个含有

    console.log(name4.startsWith('钱')); //返回值  false,第一个不含有

    console.log(name4.startsWith('钱', 1, 7)); //返回值  true,第一个含有

    console.log(name4.startsWith('王', 1, 7)); //返回值  false,第一个含有

    //String.startsWith(str,start(可选),end(可选))start(包括本身)end(不包括本身)

    //这个方法已经被加入到 ECMAScript 6 标准中,但未必在所有的 JavaScript 实现中都可以使用。然而,你可以轻松地polyfill这个方法:

    //https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith


    //endsWith()    方法用来判断当前字符串是否是以另外一个给定的子字符串“结尾”的,根据判断结果返回 true 或 false。

    console.log(name4.endsWith('杨')); //返回值  true,最后一个含有

    console.log(name4.endsWith('韩')); //返回值  false,最后一个不含有

    //String.startsWith(str)

    //这个方法已经加入到ECMAScript6标准当中,但是可能还没有在所有的JavaScript 实现中可用。

    //然而,你可以通过如下的代码片段扩展String.prototype.endsWith() 实现兼容:

    {

        if (!String.prototype.endsWith) {

            String.prototype.endsWith = function (search, this_len) {

                if (this_len === undefined || this_len > this.length) {

                    this_len = this.length;

                }

                return this.substring(this_len - search.length, this_len) === search;

            };

        }

    }


    //codePointAt();    方法返回 一个 Unicode 编码点值的非负整数。

    let str1 = "𠮷";

    console.log('𠮷'.codePointAt()); //结果:134071

    console.log('ஷ'.codePointAt());

    //给原生不支持 ECMAScript 6 的浏览器使用codePointAt()方法的的一个字符串扩展方法。

    //https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/codePointAt


    //String.fromCodePoint();  静态方法返回使用指定的代码点序列创建的字符串。

    console.log(String.fromCodePoint(2999)) //结果:ஷ

    console.log(String.fromCodePoint(134071)) //结果:𠮷

    //String.fromCodePoint 方法是 ECMAScript2015(ES6)新增加的特性,所以一些老的浏览器可能还不支持。可以通过使用下面的 polyfill 代码来保证浏览器的支持:

    //https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/fromCodePoint

    //String.raw();    是一个模板字符串的标签函数,它的作用类似于 Python 中的字符串前缀 r 和 C# 中的字符串前缀 @,是用来获取一个模板字符串的原始字面量值的。

    let str3 = `hello\nworld`

    console.log(str3) //结果:hello 换行 world

    console.log(String.raw `hello\nworld`) //结果:hello\nworld


    //normalize();  会按照指定的一种 Unicode 正规形式将当前字符串正规化.

    //示例:

    //https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/normalize


    //for…of可以遍历字符串 比如for(let a of “hello”){console.log(a);} 打印出hello各个字母

    for (let a of 'hello') {

        console.log(a)

    };


上一篇下一篇

猜你喜欢

热点阅读