关于js字符串与js数组的一些说明:
字符串与数组有一定的相同之处,都可以通过length属性获取大小,都可以通过下标访问,都能用for循环遍历每个字符/元素
字符串与数组的不同之处,数组可以随意修改原数组,字符串是字符只读数组,一旦创建不可以修改
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
,具体如下:
-
参数为非正则或正则但是不全局匹配,返回一个数组,数组成员如下:
第0个元素:匹配文本
index:首次匹配到子字符串的位置
input:原字符串
groups:当前并不被支持 -
参数为正则全局匹配:返回所有匹的值组成的数组
语法: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)
附:正则定义的两种方式
- var regexp = /pattern/modifiers;
- 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")
var arr2 = []
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码