javaScript教程之JS常用字符串API汇总梳理qw8704149的博客-

关于js字符串与js数组的一些说明：

1. 字符串与数组有一定的相同之处，都可以通过length属性获取大小，都可以通过下标访问，都能用for循环遍历每个字符/元素
2. 字符串与数组的不同之处，数组可以随意修改原数组，字符串是字符只读数组，一旦创建不可以修改

1.字符串拼接concat()、+、模板字符串

concat()函数:将多个字符串拼接成新字符串，返回新拼接的字符串
语法:var newStr = str.concat(string1,string2,…,stringx)

var str = "dream-"; var str1 = "starts"; var str2 = "-with-lighting-matches"; var newStr1 = str.concat();//没有参数功能等同复制字符串 var newStr2 = str.concat(str1);//将str与str1拼接返回 var newStr3 = str.concat(str1,str2); //将str与str1、str2拼接返回  console.log(newStr1)//dream- console.log(newStr2);//dream-starts console.log(newStr3);//dream-starts-with-lighting-matches 

通过 + 拼接字符串
用法:var newStr = str + string1 + string2 +… +stringx

var str = "dream-"; var str1 = "starts"; var str2 = "-with-lighting-matches"; var newStr1 = str + str1;//将str与str1拼接 var newStr2 = str + str1 + str2; //将str与str1、str2拼接  console.log(newStr1);//dream-starts console.log(newStr2);//dream-starts-with-lighting-matches 

通过模板字符串拼接字符串ES6新增
用法:var newStr = ${string1}${string2}...${stringx}

//用法:var newStr = `${string1}${string2}...${stringx}` var str = "dream"; var str1 = "starts"; var str2 = "with-lighting-matches"; var newStr1 = `${str}-${str1}`;//将str与str1拼接 var newStr2 = `${str}-${str1}-${str2}`; //将str与str1、str2拼接  console.log(newStr1);//dream-starts console.log(newStr2);//dream-starts-with-lighting-matches 

2.字符串选取substring()、substr()、slice()

substring()函数:选取两个指定索引之间的字符串,两个参数时遵循含头不含尾的原则，返回新选取的字符串
语法:var newStr = str.substring([starti [,endi]])
注意：substring会以较小参数作为起始位置，较大参数作为结束位置

var str = "dream-starts-with-lighting-matches"; var newStr1 = str.substring();//没有参数代表选取所有字符 var newStr2 = str.substring(5);//一个参数代表开始位置，选取从索引5开始开始到结束字符 var newStr3 = str.substring(5,10); //选取索引5到索引10之间的字符，不包括索引10 //以较小参数作为起始位置，较大参数作为结束位置 var newStr4 = str.substring(10,5); //选取索引5到索引10之间的字符，不包括索引10 console.log(newStr1)//dream-starts-with-lighting-matches console.log(newStr2);//-starts-with-lighting-matches console.log(newStr3);//-star console.log(newStr4);//-star 

substr()函数:选取从指定位置开始指定长度的字符串，返回新选取的字符串
语法:var newStr = str.substr([starti [,length]])

var str = "dream-starts-with-lighting-matches"; var newStr1 = str.substr();//没有参数代表选取所有字符 var newStr2 = str.substr(5);//一个参数代表开始位置，选取从索引位置5开始到结束字符 var newStr3 = str.substr(5,8);//从索引位置5开始选取8个字符 console.log(newStr1)//dream-starts-with-lighting-matches console.log(newStr2);//-starts-with-lighting-matches console.log(newStr3);//-starts- 

slice()函数:选取两个指定索引之间的字符串,两个参数时遵循含头不含尾的原则，返回新选取的字符串
语法:var newStr = str.slice([starti [,endi]])

var str = "dream-starts-with-lighting-matches"; var newStr1 = str.slice();//没有参数代表选取所有字符 var newStr2 = str.slice(5);//一个参数代表开始位置，选取从索引5开始开始到结束字符 var newStr3 = str.slice(5,10); //选取索引5到索引10之间的字符，不包括索引10 console.log(newStr1)//dream-starts-with-lighting-matches console.log(newStr2);//-starts-with-lighting-matches console.log(newStr3);//-star 

3.字符串查找indexOf()、lastIndexOf()、search()、match()、exec()

indexOf()函数:从头开始往后查找指定值,返回指定值出现的第一个索引，找不到返回-1
语法:var index = str.indexOf(searchvalue [,fromindex])

var str = "Good good good study, day day day up"; var  index1 = str.indexOf('good'); console.log(index1);//5 var  index2 = str.indexOf('good',6); console.log(index2);//10 var  index3 = str.indexOf('No'); console.log(index3);//-1 

lastIndexOf()函数:从字符串后面开始往前查找指定值,返回指定值出现的第一个索引，找不到返回-1
语法:var index = str.lastIndexOf(searchvalue [,fromindex])

var str = "Good good good study, day day day up"; var  index1 = str.lastIndexOf('good'); console.log(index1);//10 var  index2 = str.lastIndexOf('good',6); console.log(index2);//5 var  index3 = str.lastIndexOf('good',3); console.log(index3);//-1 

search()函数:查找指定值/正则匹配的值在字符串中的位置,返回找到的第一个索引，找不到返回-1
语法:var index = str.search(regexp/searchvalue )

var str = "Good good good study, Day day day up"; var  index1 = str.search('good'); console.log(index1);//5 var  index2 = str.search('No'); console.log(index2);//-1 var  index3 = str.search(/good/); console.log(index3);//5 var  index3 = str.search(/good/i);//根据正则查找，不区分大小写 console.log(index3);//0 

match()函数:查找指定值/正则匹配的元素,返回值根据是否全局匹配(正则中是否有g标识)有所不同,没找到返回 null，具体如下：

1. 参数为非正则或正则但是不全局匹配，返回一个数组，数组成员如下:
   第0个元素:匹配文本
   index:首次匹配到子字符串的位置
   input:原字符串
   groups:当前并不被支持

2. 参数为正则全局匹配：返回所有匹的值组成的数组

语法:var arr= str.match(regexp/searchvalue )

var str = "Good good good study"; var  arr1 = str.match('good'); console.log(arr1);//["good", index: 5, input: "Good good good study", groups: undefined] var  arr2= str.match('No'); console.log(arr2);//null var  arr3= str.match(/good/); console.log(arr3);//["good", index: 5, input: "Good good good study", groups: undefined] var  arr4 = str.match(/good/g);//全局查找，区分大小写 console.log(arr4);//["good", "good"] var  arr5 = str.match(/good/ig);//全局查找，不区分大小写 console.log(arr5);// ["Good", "good", "good"] var  arr6 = str.match(/No/ig);//全局查找，不区分大小写 console.log(arr6);// null 

exec()函数:查找正则匹配的元素,没找到返回 null, 找到返回新组成的数组，数组成员如下：

• 第0个元素:匹配文本
• index:首次匹配到子字符串的位置
• input:原字符串
• groups:当前并不被支持

正则是否全局匹配(是否有g标识)调用过程不同 正则对象中的lastIndex属性的值是用来控制检查字符开始的位置，如果是非全局匹配该值为零，若为全局匹配，该值为上一次找到字符串的尾部索引的下一位

语法:var arr = regexp.exec(str)

附:正则定义的两种方式

1. var regexp = /pattern/modifiers;
2. var regexp = new RegExp(pattern,modifiers);

• modifiers(修饰符)说明:
  i:忽略大小写；
  g:全局匹配；
  m:多行匹配，当要检索的字符串为单行时，使用 m无意义

var str = "Good good good study"; var regexp1 = /good/ var  arr1 = regexp1.exec(str); console.log(arr1);//["good", index: 5, input: "Good good good study", groups: undefined] //var regexp2 = /good/g var regexp2 = new RegExp(/good/,"g") do {   console.log(arr2)   console.log(regexp2.lastIndex) } while ((arr2 = regexp2 .exec(str)) != null) //do-while会循环输出3次，每次内容如下 //第一次 //null //0 //第二次 //["good", index: 5, input: "Good good good study", groups: undefined] //9 //第三次 //["good", index: 10, input: "Good good good study", groups: undefined] //14 

4.字符串替换replace()

replace()函数:将字符串中匹配的内容替换为新内容，返回替换后的字符串
语法:var newStr = str.replace(regexp/substr,replacement)

var str = "Good good good study, day day day up"; var newStr1 = str.replace('good','hard');//普通替换只替换第一个匹配的位置 var newStr2 = str.replace(/good/g,'hard');//利用正则全局查找替换，区分大小写 var newStr3 = str.replace(/good/ig,'hard');//利用正则全局查找替换，不区分大小写 var newStr4 = str.replace(/s+/g,'');//去除空格  console.log(newStr1)//Good hard good study, day day day up console.log(newStr2);//Good hard hard study, day day day up console.log(newStr3);//hard hard hard study, day day day up console.log(newStr4);//Goodgoodgoodstudy,daydaydayup 

5.字符串分割为数组split()

split()函数:根据指定的分隔符将字符串分割为数组，返回分割字符串生成的数组
语法:var newArr = str.split(separator,howmany)

var str1 = "dream-starts-with-lighting-matches"; var newArr1 = str1.split('-');//将字符串根据'-'分割为数组 var newArr2 = str1.split('-', 3);//将字符串根据'-'分割为数组,只取前三个  console.log(newArr1)//["dream", "starts", "with", "lighting", "matches"] console.log(newArr2);//["dream", "starts", "with"] //拓展，split通常会和join配套使用 var str1 = "dream-starts-with-lighting-matches"; var newArr3 = str1.split('-');//将字符串根据'-'分割为数组 var str3 = newArr3.join('&') console.log(newArr1)//["dream", "starts", "with", "lighting", "matches"] console.log(str3)//dream&starts&with&lighting&matches 

6.字符串大小写转换toLowerCase()、toUpperCase()

toLowerCase()函数:将字符串中的字符都转换为小写，返回转换后的字符串
语法:var newStr = str.toLowerCase()
toUpperCase()函数:将字符串中的字符都转换为大写，返回转换后的字符串
语法:var newStr = str.toUpperCase()

var str = "Good good study, Day day up"; var newStr1 = str.toLowerCase(); var newStr2 = str.toUpperCase();  console.log(newStr1)//good good study, day day up console.log(newStr2);//GOOD GOOD STUDY, DAY DAY UP 

7.获取指定位置的字符charAt()、字符编码值charCodeAt()

charAt()函数:获取字符串中指定位置/索引的字符，返回获取的字符
语法:var newChar = str.charAt(index)

charCodeAt()函数:获取字符串中指定位置/索引的字符编码，返回获取的字符编码
语法:var newCharCode = str.charCodeAt(index)

var str = "Good good study, Day day up"; var char1 = str.charAt(0); var char2 = str.charAt(5); var charCode1 = str.charCodeAt(0); var charCode2 = str.charCodeAt(5); console.log(char1)//G console.log(char2);//g console.log(charCode1);//71 字符G的ASCII码 console.log(charCode2);//103 字符g的ASCII码