String 类型的方法

concat方法：连接字符串

 1 console.log('concat用法')
 2 
 3     var s1="a";
 4 
 5     var s2="b";
 6 
 7     var s3="c";
 8 
 9     console.log(s1.concat(s2,s3));//abc
10 
11 //    等同于：result = s1 + s2 + ... + s
12 
13 //    关联记忆：数组中的concat
14 
15     var arr = [1, 2, 3];
16 
17     console.log(arr.concat(4, 5));//[1,2,3,4,5]

indexOf方法：找到匹配项返回索引值，如果没找到返回-1

 1 console.log('indexOf用法')
 2 
 3 //    获取索引值indexOf
 4 
 5 //    常用方法：找到匹配项返回索引值，如果没找到返回-1
 6 
 7     var myString="JavaScript";
 8 
 9     var a1=myString.indexOf("v");//2
10 
11     var a2=myString.indexOf("S");//4
12 
13     var a3=myString.indexOf("Script");//4
14 
15     var a4=myString.indexOf("key");// 如果没有匹配项返回 -1
16 
17     console.log(a1)//2
18 
19     console.log(a2)//4
20 
21     console.log(a3)//4
22 
23     console.log(a4)//-1
24 
25  
26 //    完整的indexof用法：
27 
28 //    可以传入第二个参数：indexOf（str，fromIndex）
29 
30 //    表示从索引位置fromIndex开始查找，如果fromIndex省略，则表示默认从起始索引0开始查找；
31 
32 //    若fromIndex为负，则从索引0开始查找。
33 
34     var b1 = myString.indexOf("v",5);// 从下标5开始查找，而v在索引2，所以找不到，返回-1
35 
36     var b2 = myString.indexOf("v",1);// 2
37 
38     console.log(b1)//-1
39 
40     console.log(b2)// 2

charAt方法: 返回指定索引位置的字符，若索引越界，返回空字符串

 1 console.log('charAt用法')
 2 
 3 //返回指定索引位置的字符
 4 
 5 //(因为Javascript中没有字符类型，所以返回的是长度为1的字符串)。
 6 
 7     myString="JavaScript";
 8 
 9     console.log(myString.charAt(1));//a
11     console.log(myString.charAt(10000000000000000));//若索引越界，返回空字符串
13     console.log(myString.charAt(-1));//若索引越界，返回空字符串  -- ""
15     console.log(myString.charAt(-10000000000000000000000));//若索引越界，返回空字符串

substr(fromIndex,length)：获取部分字符串

从起始索引fromIndex开始截取长度length的字符串

 1 console.log('substr用法')
 2 
 3 //从起始索引fromIndex开始截取长度length的字符串 - 正向截取
 4 
 5     myString="JavaScript";
 6 
 7     console.log(myString.substr(1,1));//a          表示从第1个索引值开始截取，截取1个字符
 8 
 9     console.log(myString.substr(1,2));//av女忧     表示从第1个索引值开始截取，截取2个字符
10 
11     console.log(myString.substr(1,3));//ava        表示从第1个索引值开始截取，截取3个字符
12 
13     console.log(myString.substr(1,4));//avaS       表示从第1个索引值开始截取，截取4个字符
14 
15  
16 
17     //若不指定length或者length超过可截取的最大长度，则截取到结尾。
18 
19     console.log(myString.substr(1));//avaScript
20 
21     console.log(myString.substr(1,4000000));//avaScript
22 
23     //反向截取
24 
25     //若起始索引为负，则从右往左开始截取 - -1表示倒数第一个， -2表示倒数第二个
26 
27     myString="JavaScript";
28 
29     console.log(myString.substr(-1,1));//t  表示从倒数第一个开始截取，截取1个字符
30 
31     console.log(myString.substr(-2,1));//p  表示从倒数第二个开始截取，截取1个字符
32 
33     console.log(myString.substr(-3,1));//i  表示从倒数第三个开始截取，截取1个字符
34 
35     console.log(myString.substr(-4,1));//r  表示从倒数第四个开始截取，截取1个字符
36 
37     console.log(myString.substr(-5,1));//c  表示从倒数第五个开始截取，截取1个字符
38 
39     console.log(myString.substr(-6,1));//S  表示从倒数第六个开始截取，截取1个字符
40 
41     console.log(myString.substr(-7,1));//a  表示从倒数第七个开始截取，截取1个字符
42 
43  
44 
45     myString="JavaScript";
46 
47     console.log(myString.substr(-6,1));//S  表示从倒数第6个开始截取，截取1个字符
48 
49     console.log(myString.substr(-6,2));//Sc  表示从倒数第6个开始截取，截取2个字符
50 
51     console.log(myString.substr(-6,3));//Scr  表示从倒数第6个开始截取，截取3个字符
52 
53     console.log(myString.substr(-6,4));//Scri  表示从倒数第6个开始截取，截取4个字符
54 
55     console.log(myString.substr(-6,5));//Scrip  表示从倒数第6个开始截取，截取5个字符
56 
57     console.log(myString.substr(-6,6));//Script  表示从倒数第6个开始截取，截取6个字符
58 
59  
60 
61     //男生的作业：
62 
63     //从倒数的方式开始截取，获取av
64 
65     myString="JavaScript";
66 
67     console.log(myString.substr(-9,2));//Script  表示从倒数第6个开始截取，截取6个字符
68 
69  
70 
71     //女生的作业：
72 
73     //整数的方式获取曲线S
74 
75     //首先思考 我要获取几个字符，则后面的参数就确定了
76 
77     myString="JavaScript";
78 
79     console.log(myString.substr(4,1));//S  表示从索引值4开始截取，截取1个字符
80 
81     console.log(myString.substr(-6,1));//S  表示从倒数第6个开始截取，截取1个字符

substring(startIndex,endIndex):获取部分字符串

截取起始索引startIndex 到结束索引endIndex的子字符串，

结果包含startIndex处的字符，不包含endIndex处的字符。

 1  console.log('substring用法')
 2 
 3     //男生的作业：获取av
 4 
 5     myString="JavaScript";
 6 
 7     console.log(myString.substring(1,3));
 8 
 9  
10 
11     //女生的作业：获取曲线S
12 
13     myString="JavaScript";
14 
15     console.log(myString.substring(4,5));
16 
17  
18 
19     //其他小点：
20 
21     //如果省略个数,则自动获取后面所有
22 
23      console.log(myString.substring(4));//Script
24 
25     //若startIndex或者endIndex为负，则会被替换为0。
26 
27     console.log(myString.substring(-1,1));//J
28 
29     //若startIndex = endIndex，则返回空字符串。
30 
31     console.log(myString.substring(3,3));//返回空
32 
33     //若startIndex > endIndex，则执行方法时，两个值会被交换。
34 
35     console.log(myString.substring(3,1));//等价于myString.substring(1,3)

slice(startIndex,endIndex)：获取部分字符串

截取起始索引startIndex 到结束索引endIndex的子字符串，

结果包含startIndex处的字符，不包含endIndex处的字符。

 console.log('slice(startIndex,endIndex)用法')

    myString="JavaScript";

    console.log(myString.slice(1,3)) //av

    console.log(myString.slice(4,5)) //S

    console.log(myString.slice(4)) //Script  //如果省略个数,则自动获取后面所有

    // 基本用法和substring用法一样，不同点如下：


//    stringObj.slice(start, [end])

//    如果 start 为负，将它作为 length + start处理，此处 length 为数组的长度。

       console.log(myString.slice(-1,3))

//    如果 end 为负，就将它作为 length + end 处理，此处 length 为数组的长度。

       console.log(myString.slice(2,-3))

//    如果省略 end ，那么 slice 方法将一直复制到 arrayObj 的结尾。

//    如果 end 大于 start，不复制任何元素到新数组中。

//    strVariable.substring(start, end)

//    如果 start 或 end 为 NaN 或者负数，那么将其替换为0。

//    子字符串的长度等于 start 和 end 之差的绝对值。例如，在 strvar.substring(0, 3) 和 strvar.substring(3, 0) 返回的子字符串的的长度是 3。

//    slice可以对数组操作，substring不行。。。

split()分割:按给定字符串分割，返回分割后的多个字符串组成的字符串数组。

1     console.log('split()用法')
2 
3     var s="a,bc,d";
4 
5     console.log(s.split(","));//["a", "bc", "d"]
6 
7     s="a1b1c1d1";
8 
9     console.log(s.split("1"));//["a", "b", "c", "d", ""]

Join()合并:使用您选择的分隔符将一个数组合并为一个字符串

 1     console.log('John用法')
 2 
 3     var myList=new Array("jpg","bmp","gif","ico","png");
 4 
 5     var imgString=myList.join("|");//结果是jpg|bmp|gif|ico|png
 6 
 7     console.log(imgString)
 8 
 9 
10     //split()还可以结合正则表达式
11 
12     myString = 'javascript is a good script language';
13 
14     console.log(myString.split(/s/)); //javascript,is,a,good,script,language
15 
16     //传入s表示要匹配空格，我们将字符串分割为一个数组，如果你要访问某一个，那么可以明确指出：
17 
18     console.log(myString.split(/s/)[3]); //good

字符串大小写转换: 使用您选择的分隔符将一个数组合并为一个字符串

 1     console.log('字符串大小写转换')
 2 
 3     myString="JavaScript";
 4 
 5     myString = myString.toLowerCase();//javascript
 6 
 7     console.log(myString)
 8 
 9     myString = myString.toUpperCase();//JAVASCRIPT
10 
11 console.log(myString)

replace用法1 - 基础用法:最核心点：如果要替换全部匹配项，需要传入一个 RegExp 对象并指定其 global 属性。

 1  console.log('replace基本用法')
 2 
 3     //基本用法：
 4 
 5     myString = "javascript is a good script language";
 6 
 7     //在此我想将字母a替换成字母A
 8 
 9     console.log(myString.replace("a","A"));
10 
11     //    我想大家运行后可以看到结果，它只替换了找到的第一个字符，如果想替换多个字符怎么办？
12 
13     //    答案：结合正则表达式，这也是replace的核心用法之一！
14 
15  
16 
17     //将字母a替换成字母A 错误的写法  少了/g
18 
19     myString = "javascript is a good script language";
20 
21     console.log(myString.replace(/a/,"A"));
22 
23     //console.log(myString.replace(new RegExp('a','gm'),"A"));
24 
25 
26     //将字母a替换成字母A  正确的写法 /g表示匹配所有
27 
28     myString = "javascript is a good script language";
29 
30     console.log(myString.replace(/a/g,"A"));

replace用法2 - 高级用法

特殊标记$

//replace高级技巧 - 特殊标记$

console.log('replace功能4 - 特殊标记$')

// 对于正则replace约定了一个特殊标记符$：

// 1.$i (i:1-99) : 表示从左到右正则子表达式所匹配的文本。

// 2.$&:表示与正则表达式匹配的全文本。

// 3.$`(`:切换技能键)：表示匹配字符串的左边文本。

// 4.$'(‘:单引号)：表示匹配字符串的右边文本。

// 5.$$：表示$转移。

// $i (i:1-99) : 表示从左到右正则子表达式所匹配的文本

//案例1- 匹配后替换

console.log('replace功能1 - 匹配后替换')

//在本例中，我们将把所有的花引号替换为直引号：

myString = '"a", "b"';

myString = myString.replace(/"([^"]*)"/g, "'$1'");//寻找所有的"abb"形式字符串，此时组合表示字符串，，然后用'$1'替换

console.log(myString)

//案例2- 匹配后替换

myString= "javascript is a good script language";

console.log(myString.replace(/(javascript)s*(is)/g,"$1 $2 fun. it $2"));

//案例3 - 分组匹配后颠倒

console.log('replace功能2 - 颠倒')

//在本例中，我们将把 "itcast,cn" 转换为 "cn itcast" 的形式：

myString = "itcast , cn";

myString = myString.replace(/(w+)s*, s*(w+)/, "$2 $1");

console.log(myString)

//案例4 - 分组匹配后颠倒

myString = "boy & girl";

myString.replace(/(w+)s*&s*(w+)/g,"$2 & $1") //girl & boy

console.log(myString)

// $&:表示与正则表达式匹配的全文本。

myString = "boy";

myString.replace(/w+/g,"$&-$&") // boy-boy

console.log(myString)

// $`(`:切换技能键)：表示匹配字符串的左边文本。

myString = "javascript";

myString.replace(/script/,"$& != $`") //javascript != java

console.log(myString)

// $'(‘:单引号)：表示匹配字符串的右边文本。

myString = "javascript";

myString.replace(/java/,"$&$' is ") // javascript is script

console.log(myString)

replace用法2 - 高级用法第二个参数可以是函数 - 最常用必考点

//无敌的函数 - replace第二个参数可以传递函数

//如果第二参数是一个函数的话，那么函数的参数是什么呢？

console.log('replace功能5 - 无敌的函数 - replace第二个参数可以传递函数')

myString = "bbabc";

myString.replace(/(a)(b)/g, function(){

console.log(arguments) // ["ab", "a", "b", 2, "bbabc"]

});

// 参数将依次为：

// 1、整个正则表达式匹配的字符。

// 2、第一分组匹配的内容、第二分组匹配的内容…… 以此类推直到最后一个分组。

// 3、此次匹配在源自符串中的下标（位置）。

// 4、源自符串

// 所以例子的输出是 ["ab", "a", "b", 2, "bbabc"]

//用法举例首字母大写 -- 一个参数表示匹配的整个字符串

console.log('replace功能3 - 将首字符转为大写')

//在本例中，我们将把字符串中所有单词的首字母都转换为大写：

myString = 'aaa bbb ccc';

myString=myString.replace(/w+/g, function(word){

return word.substring(0,1).toUpperCase()+word.substring(1);}

);

console.log(myString)

//用法举例首字母大写 -- 多个参数 - 第一个表示匹配的整个字符串，后面的表示分组中的内容

function capitalize(str){

return str.replace( /(^|s)([a-z])/g , function(m,p1,p2){ return p1+p2.toUpperCase();

} );

};

myString = "i am a boy !"

console.log(capitalize(myString)) //I Am A Boy！

//第2种方法：基于函数(关键字变红)

document.write("replace使用场景第2种实现 - 牛逼的函数 - 关键字变色:"+"<br />");

function test(str){

return "<font color='red'>"+str+"</font>"

}

myString="传智播客是中国最有前景，口碑最好的IT综合教育培训机构，传智播客的宗旨是：一切为了学生，传智播客在全国有众多分校";

myString=myString.replace(/(传智播客)/g,test);

document.write(myString);