js之字符串的常用方法

  字符串的方法有很多,包括toString(),toLocaleString(),valueOf(),charAt(),charCodeAt(),fromCharCode(),concat(),slice(),substr(),substring(),toLowerCase(),toUpperCase(),indexOf(),match(),search(),replace(),split()等二十多种方法。下面来分别的介绍。

    1、访问字符的方法

    访问字符的方法有以下几种:charAt(),charCodeAt(),fromCharCode()。

    a. charAt() 方法从一个字符串中返回指定的字符。

    语法:str.charAt(index)。index是一个介于0和字符串长度减1之间的数,如果没有index或者index为NaN的话,charAt()将使用0。

    使用:字符串中的字符从左向右进行索引,第一个字符索引值为0,最后一个字符的索引值为str.length-1。如果index超出了这个范围,则返回一个空字符串。

    b. charCodeAt()方法,返回的是指定位置的字符16位Unicode编码。

    语法:charCodeAt(index)。index是一个基于0的字符位置的参数。参数为空或NaN时,默认参数为0。当参数超出范围返回NaN。

    c. fromCharCode()方法返回由指定的UTF-16代码单元序列创建的字符串。

    语法:fromCharCode(num1,...,numN)。num1,...,numN一系列UTF-16代码单元的数字。 范围介于0到65535(0xFFFF)之间。 如果大于0xFFFF的话,那么不再进行有效的检查。返回长度为N的字符串,由N个指定的UTF-16代码单元组成。

    <script>
        //charAt()
        let str = 'davina';
        console.log(str.charAt()); //d
        console.log(str.charAt(4));//n
        console.log(str.charAt(NaN));//d
        console.log(str.charAt(8)); //''
        //charAt()方法涉及以Number()函数的隐式类型转换
        console.log(str.charAt(true));//a
        console.log(str.charAt('c'));//d

        //charCodeAt()
        let str = 'davina';
        console.log(str.charCodeAt()); //100
        console.log(str.charCodeAt(4));//110
        console.log(str.charCodeAt(NaN));//100
        console.log(str.charCodeAt(8)); //NaN
        //charCodeAt方法涉及以Number()函数的隐式类型转换
        console.log(str.charCodeAt(true));//97
        console.log(str.charCodeAt('c'));//100

        //fromCharCode()
        console.log(String.fromCharCode());//''
        console.log(String.fromCharCode(NaN));//''
        console.log(String.fromCharCode(100, 97, 118, 105, 110, 97) //davina
        );
    </script>

    2、字符串拼接

    字符串的拼接可以用concat()和+两种方法

    a. + 加与运算符可以实现字符串的拼接,需要注意的是,当操作数其中一个是字符串或者对象转换为字符时,才进行字符串的拼接。用的最多,性能问题。

    b. concat()方法将一个或者多个字符串与原字符串连接合并,形成一个新的字符串。

    语法:str.concat(string2...stringN)。值得注意的是concat()方法最终返回一个新的字符串,对原字符串不影响。

    <script>
        let str1 = 'davina';
        let str2 = '是一个小仙女啦!';
        console.log(str1 + str2); //davina是一个小仙女啦!
        console.log(str1.concat(str2), str1, str2); //davina是一个小仙女啦!   davina   是一个小仙女啦!
        //console.log((true).concat('davina'));注意:第一个参数只能是字符串,如果是其它类型则报错

        //由于数组也有concat()方法,参数会按照第一个参数的类型进行判断
        console.log([1, 2, 3, 4].concat(',5,6')) //[1, 2, 3, 4, ",5,6"]
        console.log('1,2,3,4'.concat([, 5, 6])) //1,2,3,4,5,6
    </script>

    3、大小写转换

    关于大小写转换有四种方法,分别如下:

    a. toUpperCase()方法将字符串转换成大写

    b. toLowerCase()方法将字符串转换在小写

    c. toLocaleUpperCase()方法将字符串转换成大写(针对地区)

    d. toLocaleLowerCase()方法将字符串转换成小写(针对地区)

    <script>
        let str1 = 'DAVina';
        let upperStr = str1.toUpperCase(str1);
        let lowerStr = str1.toLowerCase(str1);
        console.log(str1, upperStr, lowerStr); //DAVina DAVINA davina  原字符串无变化
        //如果不知道代码将在哪个环境中运行,建议使用针对地区的方法
        console.log(str1.toLocaleUpperCase(), str1.toLocaleLowerCase()); //DAVINA davina
    </script>

    4、查找子字符串的位置

    a. indexOf()方法,通过字符找下标(从左向右找到这个字符出现的位置)

    语法:str.indexOf(searchValue,fromIndex)。这里需要说明白的是:searchValue是要被查找的字符串值,如果没有提供确切的字符串,它会被设置成"undefined",然后在当前字符串中查找这个值。fromIndex数字表示开始查找的位置,可以是任意整数,默认值为0。是一个可先的参数。

    返回值:查找的字符串 searchValue 的第一次出现的索引,如果没有找到,则返回 -1。

    b. lastIndexOf()方法,通过字符找下标(从右向左找到这个字符出现的位置)

    语法:str.lastIndexOf(searchValue,fromIndex)。需要注意的是fromIndex如果没有的话,默认从最后一个字符开始。

 <script>
        let str = 'hello world';
        console.log(str.indexOf('o'));//4
        //注意:fromIndex如果是被忽略,或者为undefined,NaN,负数时,fromIndex=0
        console.log(str.indexOf('ld', undefined));//9
        console.log(str.indexOf('or', -10));//7
    
        console.log(str.lastIndexOf('o')); //7
        console.log(str.lastIndexOf('ld', undefined));//9
        console.log(str.lastIndexOf('or', -10));//-1

        //查找出所以符合条件的字符串
        function fn(str, value) {
            let result = [];
            let n = str.indexOf(value);
            while (n > -1) {
                result.push(n);
                n = str.indexOf(value, n + value.length);
            }
            return result;
        }
        console.log(fn('davinadavinadavina', 'in')) // [3, 9, 15]

        //lastIndexOf()方法常用来获取url地址中的扩展名
        let url = 'https://www.cnblogs.com/csguo/p/7401874.html';
        function getFileFormat(url) {
            let i = url.lastIndexOf('.');
            return url.slice(i + 1);
        }
        console.log(getFileFormat(url)); //html
    </script>

     5、创建子字符串

    a. slice() 截取字符串

    语法:str.slice(beginSlice,endSlice).这两个参数分别代表着开始的位置和结束的位置。返回截取到的那个字符串,原字符串没有变化。

    需要注意的是如果一个参数都没有,直接返回整个字符串;如果只有一个参数,代表开始的位置,结束的位置默认为字符串的最后一个字符;如果有两个参数,第二参数为结束的位置(但是不包含它);参数可以放负数,但是开始的位置不能大于结束的位置,开始的位置是最后一位的话,代表-1。

    b.substring()截取字符串

    语法:str.substring(indexStart,indexEnd). 这两个参数分别代表了开始的位置和结束的位置。返回这个字符串从indexStart的位置的字符到indexEnd(但不包含)位置的字符的一个子字符串。如果一个参数也没有,会返回整个字符串;如果只有一个参数,那就从这个参数的位置一直截取到最后一个字符;如果有两个参数那最后一个参数就代表结束的位置但是不包含它。如果任一参数是NaN或负数,则被0取代;如果indexStart大于indexEnd则交换它们的值。它返回截取后的字符串,原字符串没有变化。

     和slice的区别:slice起始位置不能大于结束位置,substring起始位置可以大于结束位置;slice可以放负数,substring是不能放负数的。

    c. substr()截取一段指定开始位置与个数的字符串

    语法:str.substr(start,length).参数分别是开始位置和截取的个数。一个参数都没有,它会把整个字符串全部返回;如果有一个字符串,那默认会从第一个参数的位置截取到最后一位字符。它返回取到的字符串,原字符串没有变化(此方法不是标准,最好不用)。 

    <script>
        let str = 'davinahello';
        console.log(str.slice()); //davinahello
        console.log(str.slice(6)); //hello
        console.log(str.slice(6, 8)); //he
        console.log(str.slice(-2)); //lo
        console.log(str.slice(true, [3])); //av
        console.log(str.slice(0, NaN)); //''

        console.log(str.substring()); //davinahello
        console.log(str.substring(6)); //hello
        console.log(str.substring(6, 8)); //he
        console.log(str.substring(-2)); //davinahello
        console.log(str.substring(true, [3])); //av
        console.log(str.substring(0, NaN)); //''
    </script>

    6、去除首尾空格

    trim()方法会从一个字符串的两端删除空白字符串

    语法:str.trim()它是没有参数的,返回一个从两头去掉空白字符的字符串,并不影响原字符串本身。

    <script>
        let str = ' 
	hello 
';
        //空白字符不仅仅包括空格,还包括制表符(	)、换行符(
)和回车符(
)
        console.log(str.trim()); //hello
        //用trim()判断输入的字符是否为空
        let str1 = '';
        if (str1.trim.length) {
            alert('不为空');
        } else {
            alert('为空')
        }
    </script>

    7、字符串分隔成数组

    split()用指定的分隔符把字符串分隔成数组

    语法:str.split(separator,limit)这两个参数分别为分隔符和分隔成数组的个数。一个参数也没有或参数是一个空格的话,会把整个字符串作为数组中的一个数据;如果参数为一个空字符,会把字符串里的每个字符作为数组中的数据;如果参数为两个,分隔后的数组的个数就是第二个参数的值。它返回一个新数组,原字符串没有变化。

    <script>
        let str = 'davina';
        console.log(str.split('')); // ["d", "a", "v", "i", "n", "a"]
        console.log(str.split());//["davina"]
        console.log(str.split());//["davina"]
        console.log(str.split('v', 2)); //["da", "ina"]
    </script>

 

原文地址:https://www.cnblogs.com/davina123/p/12524104.html