在上篇的文章中,我简单的将JavaScript中数组的方法进行了总结,这些内容对工作或者面试都有用,同时自己也有许多收获,这篇我们就对JavaScript中字符串的常用方法和使用进行总结
1、slice
- 语法:字符串.slice(
start,end
) - 参数:
start(必填)
:表示开始截取的索引位置(可以为负数)
end(可选)
:表示结束截取的索引位置(如果第二个参数不存在
,则表示截取到字符串末尾
)(可以为负数)
💢【 注:包前不包后
】
- 功能:提取字符串的某个部分
- 返回值:返回
被提取的新的字符串
- 是否改变原字符串:否
var str1 = '我是一个漂亮美丽聪明的孩子'
var str2 = str1.slice(5)
console.log('str1',str1) 我是一个漂亮美丽聪明的孩子
console.log('str2',str2) 亮美丽聪明的孩子
var str1 = '我是一个漂亮美丽聪明的孩子'
var str2 = str1.slice(5,8)
console.log('str1',str1) 我是一个漂亮美丽聪明的孩子
console.log('str2',str2) 亮美丽 //
注意:
- 如果
start
或者end
是负数,那么它规定的是从字符串的尾部开始算起的位置
var str1 = '123abc我爱你'
var str2 = str1.slice(-7,-3)
console.log('str1',str1) 123abc我爱你
console.log('str2',str2) 3abc
2、indexOf
- 语法:字符串.indexOf(
searchvalue
,start
) - 参数:
searchvalue(必填)
:要检索的字符串值
start(可选)
:在字符串中开始检索
的下标位置(如果该参数不存在,则默认从字符串首字符
,即下标0
开始) - 功能:用于
检索
某个指定的字符串值在字符串中首次出现
的下标
位置 - 返回值:返回
指定字符串第一次出现
的下标
位置;如果没找到
匹配的字符串则返回 -1
- 是否改变原字符串:否
var str1 = '我是一个漂亮美丽聪明的孩子'
var str2 = str1.indexOf('美丽')
console.log('str1',str1) 我是一个漂亮美丽聪明的孩子
console.log('str2',str2) 6
var str1 = '你爱我,我爱你,我们爱着彼此'
var str2 = str1.indexOf('爱',6)
console.log('str1',str1) 你爱我,我爱你,我们爱着彼此
console.log('str2',str2) 10
注意:
- indexOf()方法对大小写敏感
3、lastIndexOf
和indexOf用法大概相同,不过lastindexOf是返回一个指定的字符串值最后出现
的下标位置,在一个字符串中的指定位置从后向前搜索(可以理解为从右到左)
- 语法:字符串.lastIndexOf(
searchvalue
,start
) - 参数:
searchvalue(必填)
:要检索的字符串值
start(可选)
:在字符串中开始检索
的下标位置(如果该参数不存在,则默认从字符串末尾
) - 功能:用于
检索
某个指定的字符串值在字符串中最后出现
的下标
位置,在一个字符串中的指定位置start
处从后向前
搜索 - 返回值:返回
指定字符串最后一次出现
的下标
位置(该索引仍是以从左至右0开始记数的);如果没找到
匹配的字符串则返回 -1
- 是否改变原字符串:否
var str1 = '你爱我,我爱你,我们爱着彼此'
var str2 = str1.lastIndexOf('爱')
console.log('str1',str1) 你爱我,我爱你,我们爱着彼此
console.log('str2',str2) 10
var str1 = '你爱我,我爱你,我们爱着彼此'
var str2 = str1.lastIndexOf('爱',3)
console.log('str1',str1) 你爱我,我爱你,我们爱着彼此
console.log('str2',str2) 1
'canal'.lastIndexOf('a'); // returns 3 (没有指明start则从末尾l处开始反向检索到的第一个a出现在l的后面,即index为3的位置)
'canal'.lastIndexOf('a', 2); // returns 1(指明start为2则从n处反向向回检索到其后面就是a,即index为1的位置)
'canal'.lastIndexOf('a', 0); // returns -1(指明start为0则从c处向左回向检索a发现没有,故返回-1)
'canal'.lastIndexOf('x'); // returns -1
'canal'.lastIndexOf('c', -5); // returns 0(指明start为-5则视同0,从c处向左回向查找发现自己就是,故返回0)
'canal'.lastIndexOf('c', 0); // returns 0(指明start为0则从c处向左回向查找c发现自己就是,故返回自己的索引0)
'canal'.lastIndexOf(''); // returns 5
'canal'.lastIndexOf('', 2); // returns 2
注意:
- lastIndexOf()方法对大小写敏感
4、concat
- 语法:字符串.concat()
- 参数:要合并连接的字符串
- 功能:用于连接两个或多个字符串
- 返回值:返回由两个或多个字符串连接后的
新字符串
- 是否改变原字符串:否
var str1 = 'abc'
var str2 = str1.concat('我爱你')
console.log('str1',str1) abc //不改变原字符串
console.log('str2',str2) abc我爱你
5、toLowerCase
- 语法:字符串.toLowerCase()
- 参数:无
- 功能:将字符串
转换成小写
- 返回值:转换后的
小写字符串
- 是否改变原字符串:否
var str1 = 'ABC我爱你'
var str2 = str1.toLowerCase()
console.log('str1',str1) ABC我爱你
console.log('str2',str2) abc我爱你
6、toUpperCase
- 语法:字符串.toUpperCase()
- 参数:无
- 功能:将字符串
转换成大写
- 返回值:转换后的
大写字符串
- 是否改变原字符串:否
var str1 = 'abc我爱你'
var str2 = str1.toLowerCase()
console.log('str1',str1) abc我爱你
console.log('str2',str2) ABC我爱你
7、charAt
- 语法:字符串.charAt(
index
) - 参数:
指定位置下标
- 功能:返回指定下标位置的
字符
- 返回值:指定位置的
字符
- 是否改变原字符串:否
var str1 = 'abc我爱你'
var str2 = str1.charAt(3)
console.log('str1',str1) abc我爱你 // 不改变原字符串
console.log('str2',str2) 我
var str1 = 'abc我爱你'
var str2 = str1.charAt(9)
console.log('str1',str1) abc我爱你 // 不改变原字符串
console.log('str2',str2)
注意:
- 如果index不在0-str.length(不包含str.length)之间,返回空字符串
8、charCodeAt
- 语法:字符串.charCodeAt(
index
) - 参数:
指定位置下标
- 功能:返回指定位置的字符的
Unicode 编码
,返回值是 0 - 65535 之间的整数 - 返回值:
Unicode 编码
- 是否改变原字符串:否
var str1 = 'abc我爱你'
var str2 = str1.charCodeAt(3)
console.log('str1',str1) abc我爱你 // 不改变原字符串
console.log('str2',str2) 25105
var str1 = 'abc我爱你'
var str2 = str1.charCodeAt(9)
console.log('str1',str1) abc我爱你 // 不改变原字符串
console.log('str2',str2) NAN
注意:
- 如果index不在0-str.length(不包含str.length)之间,返回
NAN
9、substring
- 语法:字符串.substring(
from,to
) - 参数:
from(必填)
:表示开始截取的索引位置(不能为负数)
to(可选)
:表示结束截取的索引位置(如果第二个参数不存在
,则表示截取到字符串末尾
)(不能是负数)
💢【 注:包前不包后
】
- 功能:提取字符串的某个部分
- 返回值:返回
被提取的新的字符串
- 是否改变原字符串:否
var str1 = '123abc我爱你'
var str2 = str1.substring(3)
console.log('str1',str1) 123abc我爱你
console.log('str2',str2) abc我爱你
var str1 = '123abc我爱你'
var str2 = str1.substring(3,7)
console.log('str1',str1) 123abc我爱你
console.log('str2',str2) abc我
var str1 = '123abc我爱你'
var str2 = str1.substring(-7,-3)
console.log('str1',str1) 123abc我爱你
console.log('str2',str2)
注意:
substring() 和 slice() 方法用法差不多,都是从一个字符串中截取出一段字符串,区别是:slice()
的参数
可以是负数
,substring()
的参数不能是负数
10、split
-
语法:字符串.split(
separator
,limit
) -
参数:
separator(可选)
:用于分割的字符串
或正则表达式
(如果原字符串没找到该分隔符,就直接返回该字符串数组
)
limit(可选)
:指定返回的数组的最大长度
-
功能:把一个字符串分割成字符串数组
-
返回值:一个
字符串数组
-
是否改变原字符串:否
var str1 = '121231abc'
var str2 = str1.split()
var str3 = str1.split("")
var str4 = str1.split(" ")
console.log('str1',str1) '121231abc'
console.log('str2',str2) ['121231abc']
console.log('str3',str3) ['1', '2', '1', '2', '3', '1', 'a', 'b', 'c']
console.log('str4',str4) ['121231abc']
var str1 = '121231abc111def'
var str2 = str1.split(1)
var str3 = str1.split(1,4)
console.log('str1',str1) '121231abc111def'
console.log('str2',str2) ['', '2', '23', 'abc', '', '', 'def']
console.log('str3',str3) ['', '2', '23', 'abc']
注意:
- 如果把
空字符串 ("")
用作 separator,那么原字符串中每个字符之间都会被分割
- 返回的数组是
以 separator 为边界
进行分割,返回的数组中的字串不包括 separator 自身
11、replace
-
语法:字符串.replace(
searchvalue
,newvalue
) -
参数:
searchvalue(必须)
:要被替换掉
的子字符串
或RegExp 对象
newvalue(必须)
:用来做替换的新字符串值
-
功能:用
一些字符替换
字符串中另一些字符,或替换一个与
正则表达式匹配的子串` -
返回值:替换后的
新的字符串
-
是否改变原字符串:否
var str1 = '12ab11AABB'
var str2 = str1.replace(1)
var str3 = str1.replace(1,'*')
var str4 = str1.replace(/1/g,'*') //1为要替换的关键字,不能加引号,否则替换不生效
console.log('str1',str1) '12ab11AABB'
console.log('str2',str2) undefined2ab11AABB
console.log('str3',str3) *2ab11AABB
console.log('str4',str4) *2ab**AABB
/i/g
中的i
为要替换的关键字,不能加引号,否则不生效,i
忽略大小写,g
表示全局查找
var str1 = 'niHAO SHIjie'
var str2 = str1.replace("i","*")
var str3 = str1.replace(/i/g,'*')
var str4 = str1.replace(/i/ig,"*")
console.log('str1',str1) niHAO SHIjie
console.log('str2',str2) n*HAO SHIjie
console.log('str3',str3) n*HAO SHIj*e
console.log('str4',str4) n*HAO SH*j*e
注意:
- 如果没有全局声明,仅
第一个匹配项
会被替换
12、match
-
语法:字符串.match(
regexp
) -
参数:regexp
(必须)
:规定要匹配的模式的RegExp 对象
(如果该参数不是 RegExp 对象,则需要首先把它传递给 RegExp 构造函数,将其转换为 RegExp 对象) -
功能:在字符串中
检索指定的值
,返回所有查找的关键字内容的数组
-
返回值:存放匹配结果的
数组
( -
是否改变原字符串:否
var str1 = "we ARE happy,WE ARE very HAPPY,we are family"
var str2 = str1.match(/are/)
var str3 = str1.match(/are/g)
var str4 = str1.match(/are/ig)
var str5 = str1.match(/ae/ig)
console.log('str1',str1) "we ARE happy,WE ARE very HAPPY,we are family"
console.log('str2',str2) ['are', index: 34, input: 'we ARE happy,WE ARE very HAPPY,we are family', groups: undefined]
console.log('str3',str3) ['are']
console.log('str4',str4) ['ARE', 'ARE', 'are']
console.log('str5',str5) null
注意:
- 返回数组的内容依赖于 regexp 是否具有全局标志 g
- 如果
使用g
标志,则将返回
与完整正则表达式匹配的所有结果
,但不会返回捕获组
- 如果
未使用g
标志,则仅返回
第一个完整匹配及其相关的捕获组(Array)
,改捕获组
具有如下所述的其他属性 - 如果
没找到
匹配结果返回 null
13、substr()
警告- - - -MDN: 尽管 String.prototype.substr(…) 没有严格被废弃 (as in “removed from the Web standards”), 但它被认作是遗留的函数并且可以的话应该避免使用。它并非JavaScript核心语言的一部分,未来将可能会被移除掉。如果可以的话,使用 substring()
替代它。
-
语法:字符串.substr(
start,length
) -
参数:
start(必须)
:开始截取的子串的起始下标
(必须是数值。可以是负数
,如果是负数,那么该参数声明从字符串的尾部
开始算起的位置)
length(可选
):截取的字符数
(即截取长度
) -
功能:在字符串中
从指定下标
开始截取指定长度
的字符串 -
返回值:返回
被提取的新的字符串
-
是否改变原字符串:否
var str1 = "123abc123ABC"
var str2 = str1.substr(5)
var str3 = str1.substr(5,3)
var str4 = str1.substr(5,9)
console.log('str1',str1) 123abc123ABC
console.log('str2',str2) c123ABC
console.log('str3',str3) c12
console.log('str4',str4) c123ABC
var str = "abcdefghij";
console.log("(1,2): " + str.substr(1,2)); // (1,2): bc
console.log("(-3,2): " + str.substr(-3,2)); // (-3,2): hi
console.log("(-3): " + str.substr(-3)); // (-3): hij
console.log("(1): " + str.substr(1)); // (1): bcdefghij
console.log("(-20, 2): " + str.substr(-20,2)); // (-20, 2): ab
console.log("(20, 2): " + str.substr(20,2)); // (20, 2):
注意:
- start 是一个字符的索引。
首字符的索引为 0
,最后一个字符的索引为字符串的长度length减去1
。substr 从 start 位置开始提取字符,提取 length 个字符(或直到字符串的末尾) - 如果 start 为
正值
,且大于
或等于
字符串的长度,则 substr 返回一个空字符串
- 如果 start 为
负值
,则 substr 把它作为从字符串末尾开始
的一个字符索引。如果 start 为负值且 abs(start) 大于字符串的长度
,则 substr 使用0 作为开始
提取的索引
- 如果 length 为
0
或负值
,则 substr 返回一个空字符串
- 如果
忽略 length
,则 substr 提取字符,直到字符串末尾