字符串方法

前言:

在平常的数据解析中,数组,字符串,对象是必不可少的三种类型,今天就字符串的一些常用方法做一个整理,每个方法对应都会相应的示例,不仅是为了能够让大家一目了然,节约时间,更是为了以后自己以后也方便查阅! (在下面的方法中,有解析错误的地方,还望大家提出意见或建议,感谢!)

0、从原始字符串到模版字面量

(1.)我们原来使用的字符串:

    `hello world` `hello! world!` `hello ${who}` escape `${who}`

字符串不区分单引号’ ‘和双引号” “所有的字符串拼接都会识别,如果你的字符串比较长,可分行使用“+”来拼接。

例如:

        let longString = "This is a very long string which needs " +
                            "to wrap across multiple lines because " +
                            "otherwise my code is unreadable.";

        console.log(longString);

      //  "This is a very long string which needs to wrap across multiple lines because otherwise my code is unreadable."

或者也可以使用 “\“ 来告诉浏览器,你需要继续写这个字符串,但需要保证 “\“后面是没有任何符号或者是空格的;

例如:
    let longString = "This is a very long string which needs \
    to wrap across multiple lines because \
    otherwise my code is unreadable.";

    console.log(longString)

    // "This is a very long string which needs to wrap across multiple lines because otherwise my code is unreadable."

以前,我们用单引号或双引号表示字符串。

    let a = '123';  //单引号


    let b = "123"; //双引号

(2.)我们现在使用的模板字面量:

现在,使用模板字面量反撇号``。在实际开发中,这是经常都要用到的方法。

    let c = `123` //反撇号

在字符串中使用反撇号,只需要加上转义符 ,这时中间的 `,没有什么意义:

    let d = `12\`3` //字符串内插入反撇号的方式。  //   "12`3"

在多行字符串的使用价值:

在没有模板字面量的时候,我们要实现多行字符串,必须用到换行符:

    let a = '123\n456';
    console.log(a);
    // 123
    // 456

使用模板字面量,就可以非常简单的实现需求。

    let a = `123
    456`;

    console.log(a)       //      123
                         //      456

在模板字面量插入变量的方法

在原来的我们要在字符串中拼接变量,需要用‘+变量+’或者 + 来实现,而现在 而是使用${params}直接插入你需要添加到字符串的位置。这种方式也叫作字符串占位符。占位符支持互相嵌套模板字面量,强大吧。有了它,我们终于可以抛弃 + 拼接字符串的恶心做法了。

字符串和变量拼接:

    var str="xiaoming";
    console.log(`wo shi ${str0}`)   // "wo shi xiaoming"

变量和变量拼接:

    var str0="wo shi ";
    var str="xiaoming";
    console.log(str0+`${str}`)      // wo shi xiaoming

模板字面量的终极用法tag是一个方法,方法名你可以任意命名,这种写法被称作标签模板。

    function tag(literals, ...substitutions) {
        //literals是数组,第一个位置是"",第二个位置是占位符之间的字符串,在本例中是haha
        //substitutions是字符串中的模板字面量,可能多个

        //函数最终返回字符串
    }

1、charAt() 根据下标查询访问字符串的某个字符

在 1 个字符串中,我们知道某个字符的索引值,那么就可以通过索引值来获取当前字符

例如:
    var str1="age";
    console.log(str1.charAt(2))  //  e

    // 还可以使用  [ ] 的形式来访问,中括号填写的是字符串的下标

    var str1="age";
    console.log(str1[2])       //  e

2、字符串的比较”>” , “<” ,”===” ,”>=” ,”<=” ,”!==”

(1).字母字符串比较,会先转成ascii码,再进行比较

var str1="aa";
var str2="bb";
console.log(str1true

(2).数字字符串比较(会比较两个数字的大小)

var str1="10";
var str2="15";
var str3="10";
console.log(str1true,true

3、字符串的长度 length

在我们之前只使用过数组的length来判断,更改,清空数组等,这次我们来看一下字符串的length。 例如:

var str="我爱你中国";

console.log(str.length)   // 5

stringlength 是只读属性,下面我们做一下验证:

var str="This is an apple";

console.log(str.length)   //  16

str.length=5;

console.log(str.length)  //  16

4、charCodeAt(index) 返回表示给定索引的字符的 Unicode 的值。

方法返回 0 到 65535 之间的 UTF-16 编码单元匹配 Unicode 编码单元整数,当charCodeAt()括号中没有值时,默认为查询字符串首位的位置;当有参数时,查询的是字符串的索引值, index的值为一个大于等于 0,小于字符串长度的整数。

例:

var  str="abc";
console.log(str.charCodeAt())        //  97

var  str="abc";
console.log(str.charCodeAt(0))       //  97

结果都是一样的,查询到”a”在编码中的位置为 97

var  str="abc";
console.log(str.charCodeAt(1))      //  98

字母”b”在编码中的位置为 98

5、str.concat(str1,str2….)字符串拼接

在字符串拼接中,最常用的还是“+”;

var str = "d";
var str1 = "e";
var str2 = "f";
var str3 = str+str1+str2;
console.log(str3)              //  "def"

当然我们也可以使用concat(....)

var str1 = "a";
var str2 = "b";
var str3 = "c";
console.log(str1.concat(str2,str3))  // "abc"

6、includes(str)检测一个字符串是否在另一个字符串里包含,区分大小写

例: 我们测试def 是否在字符串str

var str="abcdef";
console.log(str.includes("def"));     //  true

而我们把“def”换成大写的“DEF”时,并不能检测到

var str="abcdef";
console.log(str.includes("DEF"));     //  false

7、endsWith() 检测字符串是不是以“str”结尾的

str.endsWith(searchString [, position]);


searchString 要搜索的子字符串。


position 在 str 中搜索 searchString 的结束位置

position 当不填写值时,默认值为str.length,也就是真正的字符串结尾处,从1开始,空格和符号也算字符。 也是开始的位置。

例:

1、当没有第二个参数时。默认第二个参数为字符串的length

var str = "To be, or not to be, that is the question.";
console.log(str.endsWith("question."))    // true

2、 第二个参数的开始时从“1”开始的,而不是从“0”

var str = "To be, or not to be, that is the question.";
console.log(str.endsWith("T",1))         // true;

3、第二个参数的计算是包含空格和标点符号的

var str = "To be, or not to be, that is the question.";
console.log(str.endsWith("To be", 5))    // true

8、indexOf()方法返回str查找的结果,如果是有返回指定索引(查找到结果的第一个字符的位置),如果没有返回“-1”,区别大小写

例:

"ABC".indexOf("A")    // 0 查询到“A”,返回位置为索引“0”

"ABC".indexOf("e")    // -1并没有查询到“e”,返回-1

"ABC".indexOf("AB")   // 0 如果查询连续字符,返回连续字符的首位位置

检测是否存在某字符串:

当检测某个字符串是否存在于另一个字符串中时,可使用下面的方法:

"Blue Whale".indexOf("Blue") !== -1; // true
"Blue Whale".indexOf("Bloe") !== -1; // false

使用 indexOf 统计一个字符串中某个字母出现的次数 在下例中,设置了 count 来记录字母 e 在字符串 str 中出现的次数:

var str = 'To be, or not to be, that is the question.';
var count = 0;
var pos = str.indexOf('e');
    while (pos !== -1) {
        count++;
        pos = str.indexOf('e', pos + 1);
//重新给pos赋值,从上个查询到str的位置+1的位置继续查找,如果能查到就会再进循环,count+1
    }

console.log(count);   // 4

9、lastIndexOf()方法返回指定值在调用该方法的字符串中最后出现的位置,如果没找到则返回-1

str.lastIndexOf(searchValue[, fromIndex])

参数:

searchValue  一个字符串,表示被查找的值。


fromIndex  从调用该方法字符串的此位置处开始查找。可以是任意整数。默认值为 str.length。如果为负值,则被看作 0。如果 fromIndex > str.length,则 fromIndex 被看作 str.length。

例: 当只有一个参数的时候,第二个值默认 str.length,也就是查询整个字符串,查找到这个 str 在整个字符串中最后出现的位置

"AVBDHIUOKL".lastIndexOf("O");     //7

"AFGHJKLL:JJHKAJALKA".lastIndexOf("A");   //18

当有第二个参数时,第二个参数会被看成查询这个字符串的结束位置

//从0到第10个索引值时,只在0的位置查询到"A",所以返回0

"AFGHJKLL:JJHKAJALKA".lastIndexOf("A",10);  // 0

//从0到第15个索引值时,在第15的位置查询到"A",所以返回15

"AFGHJKLL:JJHKAJALKA".lastIndexOf("A",15);  // 15

10、str.repeat(count)构造并返回一个新字符串,该字符串是循环完成后的新字符串

repeat(count)的值一般为数字,就好比"a".repeat(5)=="a"*5=="aaaaa", 但也会出现其他情况,例如以下:

1.当值为“-1”时,会报错,所以值不能为负数。

"abc".repeat(-1)
// RangeError: repeat count must be positive and less than inifinity

2.那我们值为“0”时,会有什么情况呢?将不会循环,返回一个空字符串。

"abc".repeat(0)   // ""

3.那么我们接下来输入一个正常的数字“1”,repeat给我们返回了"abc"*1的结果,它将循环一遍。

"abc".repeat(1)   // "abc"

4.那么我们试试“2”,看看会不会返回循环两次,确实它返回了字符串循环两遍的结果。

"abc".repeat(2)  // "abcabc"

5.那我们来试试小数,看看是循环几次呢,结果是它将小数点后面的抹去了,只循环了前面的数字。

"abc".repeat(3.5)  // "abcabcabc" 参数count将会被自动转换成整数.

6.那我们试试“1/0 ”,并没有解析出来,因为1/0==inifinity

"abc".repeat(1/0)
// RangeError: repeat count must be positive and less than inifinity

7.那我们再来试试字符串呢?结果它将字符串自动转为了 number,并正确循环并返回了。

"abcd".repeat("2")   // "abcabc"

8.看看它是否能解析中文汉字呢? 结果是并没有,也没有报错。

"abcd".repeat("二")   // ""

11、str.slice(beginSlice,endSlice)截取字符串,第一个参数为开始位置,第二个参数为结束位置,前包后不包

1.slice()从一个字符串中提取字符串并返回新字符串。在一个字符串中的改变不会影响另一个字符串。也就是说,slice不修改原字符串,只会返回一个包含了原字符串中部分字符的新字符串。

var str = "avxdsdfasd";
var str2 = str.slice(1, 4);

console.log(str,str2)  //  "avxdsdfasd","vxd"

2.注意:slice() 提取的新字符串包括beginSlice但不包括 endSlice

var str = "avxdsdfasd";
var str2 = str.slice(0,2);

console.log(str2)  //"av"

3.提取新字符串从第二个字符到第四个 (字符索引值为 1, 2, 和 3)。

"avxdsdfasd".slice(1, 4)       //"vxd"

4. 提取第三个字符到倒数第二个字符。-1 为倒数第一个。

"abckdesdf".slice(2, -1)       //"ckdesd"

5.当开始的值和结束的值都为负数时,结果会从后向前数,从-3 到-1 之间的值(前包后不包)

"abckdesdf".slice(-3, -1)       //"sd"

12、str.split()方法,使用指定的分隔符字符串将一个string对象分割成字符串数组

1.当括号中为空值时,直接将它转为字符串数组

console.log("abcdefg".split());    //  ["abcdefg"]

2.当括号中为空引号时,它将每个字符串都分割了出来

console.log("abcdefg".split(""));    // ["a", "b", "c", "d", "e", "f", "g"]

当在空引号中加上一个空格时,它会以你原字符串的空格来分割

"Webkit Moz O ms Khtml".split( "" )  //   ["Webkit", "Moz", "O", "ms", "Khtml"]

3.当括号中为字符串中的字母,它将以当前字母分割字符串

console.log("abcdefg".split("a"));    // ["", "bcdefg"]

console.log("abcdefg".split("b"));    // ["a", "cdefg"]

4.当括号中字符串并不是当前字符串中包含的,它只接转成数组字符串,不做其他操作

console.log("abcdefg".split("bbbb"));   // ["abcdefg"]

13、startsWith()检测字符串是不是以“str”开头的,根据判断返回true,false(ES6 新添,与endsWith相反)

str.startsWith(searchString [, position]);

参数:

searchString  要搜索的子字符串。


position  在`str`中搜索`searchString`的开始位置,默认值为 0,也就是真正的字符串开头处。


var str = "To be, or not to be, that is the question.";

console.log(str.startsWith("To be"))            // true

console.log(str.startsWith(" be"))              //false

console.log(str.startsWith("not to be", 10))    // true

14、str.substr()方法返回一个字符串中从指定位置开始到指定字符数的字符。

str.substr(start[, length])


start:开始截取的位置,开始索引为0,最大为str.length-1,也可为负数;


length:要截取的长度,如果不填写,默认为str.length-1;最小为1,最大为str.length-1.负数无效,如果为0或者负值,返回一个空字符串。


var str = "abcdefghij";

1.当两个值都为正值,且都在范围之内:

console.log("(1,2): "    + str.substr(1,2));   // (1,2): bc

2.当截取位置为负数时,会从后向前数,倒数第一个索引为-1,截取的长度会从当前位置向后数

console.log("(-3,2): "   + str.substr(-3,2));  // (-3,2): hi

3.当只有开始位置的值,并且为负值时,会从当前位置,截取到字符串的末尾

console.log("(-3): "     + str.substr(-3));    // (-3): hij

4.当只有开始的位置,为正值,第二个值默认是 str.length-1,也就是截取到字符串的末尾

console.log("(1): "      + str.substr(1));     // (1): bcdefghij

5.当开始的索引是超过字符串长度的负数时,就相当于字符串一直是从后向前数的

console.log("(-20, 2): " + str.substr(-20,2)); // (-20, 2): ab

6.当开始的索引是超过字符串的长度的正值时,无法截取到内容,返回空字符串

console.log("(20, 2): "  + str.substr(20,2));  // (20, 2):""

15、str.substring()截取开始位置和结束位置之间的字符串,前包后不包

str.substring(start,stop)

start:开始截取的位置,不为负数;

stop:结束的截取位置,不为负数;

当参数为负数时,不识别,默认转为 0;当第二个值为负数时,默认转为 0,,并调换开始和结束的两个值的位置,

var str= "abcdefghij";

1.当开始和结束都为正值,并都在范围内,从索引为 1 的位置截取到索引为 2 的位置;

console.log("(1,2): "    + str.substring(1,2));         // (1,2): b

2.当只有一个开始位置的值时,会从开始位置直接截取到结束位置;

console.log("(1): "    + str.substring(1));              // (1): bcdefghij

3.当开始位置为负数时,会直接转为 0 来截取;

console.log("(-1): "    + str.substring(-1));            // (-1): abcdefghij

4.当结束位置超过字符串的长度,会默认忽略第二个参数;

console.log("(1,20): "    + str.substring(1,20));        // ((-1): bcdefghij

5.当结束位置为负数,会直接转为 0,并交换开始和结束的位置;

console.log("(1,-5): "    + "sdsdfsdf".substring(1,-5));// ((1,-5): s

6.当开始位置和结束位置的值为同一值时,返回空字符串

console.log("(1,1): "    + "sdsdfsdf".substring(1,1)) ;  // ((1,1): ""

16、str.toLowerCase()将字符串转为小写的形式(并不会影响字符串本身的值)

console.log("ABC".toLowerCase());    // "abc"

17、str.UpperCase()将字符串转为大写的形式(并不会影响字符串本身的值)

console.log( "alphabet".toUpperCase() ); // "ALPHABET"

18、str.toString()方法用于将现有的对象转为字符串;

1.数组转字符串;

console.log( [1,2,3,4,5].toString());   //"1,2,3,4,5"

2.对象转字符串,将会返回[object Object],故不支持转换

var a={a:1,b:2};
console.log( a.toString());         // [object Object]

19、str.trim()方法会从一个字符串的两端删除空白字符,在这个上下文中的空白字符是所有的空白字符(space(空格键),tab,no-break``space等)以及所有行终止字符(如LFCR)。

trim()方法并不会影响原字符串,会返回一个新字符串。

例: 1.当字符串两侧都有空格时,会全部删除

var orig = '   foo  ';
console.log(orig.trim()); // 'foo'

2.当字符串单侧有空格,则就从单侧删除

var orig = 'foo    ';
console.log(orig.trim()); // 'foo'

20、String.fromCharCode(num1,num2,、、numN)用于返回当前数字所对应的字符

String.fromCharCode(num1, ..., numN)

参数

num1, ..., numN  一组序列数字,表示 Unicode 值。

该方法返回一个字符串,而不是一个 String 对象。 由于 fromCharCodeString的静态方法,所以应该像这样使用:String.fromCharCode(),而不是作为你创建的 String 对象的方法。

例:

console.log(String.fromCharCode(65,66,67));  //"ABC"

文章作者: xkloveme
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 xkloveme !
评论
 上一篇
ESLint 配置 ESLint 配置
ESLint 配置ESlint 被设计为完全可配置的,这意味着你可以关闭每一个规则而只运行基本语法验证,或混合和匹配 ESLint 默认绑定的规则和你的自定义规则,以让 ESLint 更适合你的项目。有两种主要的方式来配置 ESLint:
2018-03-13
下一篇 
数组方法 数组方法
前言: 定义:数组是值的有序集合。 JS的数组是无类型的,数组元素可以是任意类型,并且同一个数组的不同元素也可能有不同的类型,每一个值叫做元素(数组元素),每个元素在数组中有一个位置。数组在平常的coding中是比较常用的数据格式,尤其式在
2018-02-26
  目录