JavaScript中String字符串方法总结
JavaScript中String字符串方法总结
方法 | 是否修改原始值 | 是否有返回值 | 描述 |
---|---|---|---|
concat() | 否 | 是 | 连接两个或更多字符串,并返回新的字符串。 |
toLowerCase() | 否 | 是 | 把字符串转换为小写。 |
toUpperCase() | 否 | 是 | 把字符串转换为大写。 |
toString() | 否 | 是 | 返回一个字符串。 |
charAt() | 否 | 是 | 返回在指定位置的字符。 |
charCodeAt() | 否 | 是 | 返回在指定的位置的字符的 Unicode 编码。 |
fromCharCode() | 否 | 是 | 将 Unicode 编码转为字符。 |
indexOf() | 否 | 是 | 返回某个指定的字符串值在字符串中首次出现的位置。 |
lastIndexOf() | 否 | 是 | 从后向前搜索字符串,并从起始位置(0)开始计算返回字符串最后出现的位置。 |
substring() | 否 | 是 | 提取字符串中两个指定的索引号之间的字符。 |
slice() | 否 | 是 | 提取字符串的片断,并在新的字符串中返回被提取的部分。 |
substr() | 否 | 是 | 从起始索引号提取字符串中指定数目的字符。 |
split() | 否 | 是 | 把字符串分割为字符串数组。 |
match() | 否 | 是 | 查找找到一个或多个正则表达式的匹配。返回一个数组或者null。 |
replace() | 否 | 是 | 在字符串中查找匹配的子串,并替换与正则表达式匹配的子串,默认只能替换第一次匹配,想替换全部,需要使用正则表达式的g模式。返回新字符串。 |
replaceAll() | 否 | 是 | 在字符串中查找匹配的子串,并替换与正则表达式匹配的子串,只能全部替换。返回新字符串。 |
search() | 否 | 是 | 查找与正则表达式相匹配的值。返回下标。 |
includes() | 否 | 是 | 查找字符串中是否包含指定的子字符串,返回布尔值。 |
startsWith() | 否 | 是 | 查看字符串是否以指定的子字符串开头,返回布尔值。 |
endsWith() | 否 | 是 | 判断当前字符串是否是以指定的子字符串结尾的(区分大小写),返回布尔值。 |
repeat() | 否 | 是 | 复制字符串指定次数,并将它们连接在一起返回。返回新字符串。 |
toLocaleLowerCase() | 否 | 是 | 根据本地主机的语言环境把字符串转换为小写。 |
toLocaleUpperCase() | 否 | 是 | 根据本地主机的语言环境把字符串转换为大写。 |
valueOf() | 否 | 是 | 返回某个字符串对象的原始值。 |
padStart() | 否 | 是 | 如果某个字符串不够指定长度,会在头部补全。返回新字符串。 |
padEnd() | 否 | 是 | 如果某个字符串不够指定长度,会在尾部补全。返回新字符串。 |
trim() | 否 | 是 | 去除字符串两边的空白。返回新字符串。 |
trimStart() | 否 | 是 | 消除字符串头部的空格,除了空格键,方法对字符串头部(或尾部)的 tab 键、换行符等不可见的空白符号也有效。返回新字符串。 |
trimEnd() | 否 | 是 | 消除尾部的空格,除了空格键,方法对字符串头部(或尾部)的 tab 键、换行符等不可见的空白符号也有效。返回新字符串。 |
at() | 否 | 是 | 方法接受一个整数作为参数,返回参数指定位置的字符,支持负索引(即倒数的位置)。 |
方法解析
代码没有特殊标注情况下,本文环境均是在Chrome环境下测试输出
string.concat()
: 连接两个或更多字符串,并返回新的字符串。原始值不变。
写法麻烦,一般直接使用 加号拼接,效果一样
let str1 = 'asdfgh';
let str2 = 123456;
let str3 = 'zxcvbn';
// zxcvbnasdfgh123456
console.log( str3.concat( str1, str2 ) );
string.toLowerCase()
: 把字符串转换为小写。原始值不变。
let str1 = 'ASDFGH';
// asdfgh ------- ASDFGH
console.log( str1.toLowerCase(), '-------', str1 );
string.toUpperCase()
: 把字符串转换为大写。原始值不变。
let str1 = 'asdfgh';
// ASDFGH ------- asdfgh
console.log( str1.toUpperCase(), '-------', str1 );
string.toString()
: 返回一个字符串。原始值不变。
null和undefined没有这个方法,会报错
let str1 = [1,'name'];
// 输出 字符串,数组
// 1,name ------- [1, 'name']
console.log( str1.toString(), '-------', str1 );
let str2 = false;
// 输出 字符串,布尔值
// false ------- false
console.log( str2.toString(), '-------', str2 );
let str3 = { name:1 };
// 输出 字符串,布尔值
// [object Object] ------- {name: 1}
console.log( str3.toString(), '-------', str3 );
string.charAt()
: 返回下标位置的字符串。原始值不变。
- 默认值是0,可以不传下标
- 赋值或大于字符串长度,返回空
let str1 = 'asdfgh';
// g ------- a ------- ------- ------- asdfgh
console.log( str1.charAt(4), '-------', str1.charAt(), '-------', str1.charAt(-5), '-------', str1.charAt(10), '-------',str1 );
string.charCodeAt()
: 返回在指定的位置的字符的 Unicode 编码。原始值不变。
- 默认值是0,可以不传下标
- 赋值或大于字符串长度,返回空
let str1 = 'asdfgh';
// 103 '-------' 97 '-------' NaN '-------' NaN '-------' 'asdfgh'
console.log( str1.charCodeAt(4), '-------', str1.charCodeAt(), '-------', str1.charCodeAt(-5), '-------', str1.charCodeAt(10), '-------',str1 );
string.fromCharCode()
: 将 Unicode 编码转为字符。原始值不变。
// 将Unicode 编码汉字打印出来
for(var i=0x4e00; i<=0x9fa5; i++){
console.log(String.fromCharCode(i));
}
string.indexOf()
: 返回某个指定的字符串值在字符串中首次出现的位置。原始值不变。
- 区分大小写
- 如果找到了就不再继续找了,如果没找到,返回-1
- 从左往右
let str1 = 'asdfgh';
// 4 '-------' 1 '-------' -1 '-------' 'asdfgh'
console.log( str1.indexOf('g'), '-------', str1.indexOf('sd'), '-------', str1.indexOf('e'), '-------',str1 );
string.lastIndexOf()
: 从后向前搜索字符串,并从起始位置(0)开始计算返回字符串最后出现的位置。原始值不变。
- 区分大小写
- 如果找到了就不再继续找了,如果没找到,返回-1
- 从右往左
let str1 = 'asdfgh';
// 4 '-------' 1 '-------' -1 '-------' 'asdfgh'
console.log( str1.lastIndexOf('g'), '-------', str1.lastIndexOf('sd'), '-------', str1.lastIndexOf('e'), '-------',str1 );
string.substring( index1, index2 )
: 提取字符串中两个指定的索引号之间的字符,包含开始位置,不包含结束位置。原始值不变。
- 自动将负数转换成0,将大于str长度的转换成str长度
- 两个参数不管顺序如何,始终以小数字为开始,大数字为结束
- 两个参数都不传,就是完整字符串
- 如果两个参数都是负数或者两个参数都大于str长度,截取的内容都是空
- 如果一个正数一个负数就是整个字符串
- 只传一个参数,一直截取到最后,如果是负数,转换成0,如果大于str长度,就截空
let str1 = 'asdfgh';
// df
console.log( str1.substring( 2, 4 ) );
// asdf
console.log( str1.substring( -2, 4 ) );
// as
console.log( str1.substring( 2, -4 ) );
// dfgh
console.log( str1.substring( 2 ) );
// asdfgh
console.log( str1.substring( ) );
string.slice( start, end )
: 提取字符串的片断,并在新的字符串中返回被提取的部分。原始值不变。
- 自动将传入的负值与字符串的长度相加
- end参数小于start参数的话,返回空字符串
let str1 = 'asdfghjkl';
// df
console.log( str1.slice( 2, 4 ) );
//
console.log( str1.slice( -2, 4 ) );
// dfg
console.log( str1.slice( 2, -4 ) );
string.substr( start, num )
: 从起始索引号提取字符串中指定数目的字符。原始值不变。
- start开始位置,num参数指定的则是返回的字符个数。如果没有给方法传递num参数,则将字符串的长度作为结束位置
- 自动将负数的start参数加上字符串的长度,将负数的第num参数转换为0
let str1 = 'asdfgh';
// dfgh
console.log( str1.substr( 2, 4 ) );
// gh
console.log( str1.substr( -2, 4 ) );
//
console.log( str1.substr( 2, -4 ) );
// dfgh
console.log( str1.substr( 2 ) );
// asdfgh
console.log( str1.substr( ) );
string.split()
: 把字符串分割为字符串数组。原始值不变。
- 没找到字符,就返回完整字符串
- 旧浏览器不传值会将每一个字母都且分开,现在是翻红完整字符串
let str1 = 'as_d_fgh';
// ['as', 'd', 'fgh']
console.log( str1.split( '_' ) );
// ['as_d_fgh']
console.log( str1.split( '.' ) );
// ['as_d_fgh']
console.log( str1.split() );
string.match()
: 查找找到一个或多个正则表达式的匹配。返回一个数组。原始值不变。
- 如果没有符合条件,返回null
- regexp没有标志g,match方法就只能在str中执行一次匹配,没有找到匹配文本就返回null,如果匹配到了,就返回一个数组存放了与匹配到文本有关的信息,数组的第0项是与regexp匹配的文本,第1项是匹配到文本的起始字符位置,第2项是str字符串。
- regexp如果有g,mantch 方法执行全局检索,没有就返回null,有就返回匹配到的所有字符串,是一个数组
let str1 = '2017-07-03';
let regDate = /^(\d{1,4})-(\d{1,2})-(\d{1,2})$/;
// ['2017-07-03', '2017', '07', '03', index: 0, input: '2017-07-03', groups: undefined]
// 先返回完整正则匹配信息,再依次返回分组信息,然后返回文本的起始字符的位置,然后是str的完整字符串
console.log(str1.match(regDate));
let regDate2 = /^(\d{1,4})-(\d{1,2})-(\d{1,2})$/g;
// ['2017-07-03']
console.log(str1.match(regDate2));
string.replace()
: 在字符串中查找匹配的子串,并替换与正则表达式匹配的子串,默认只能替换第一次匹配,想替换全部,需要使用正则表达式的g模式。返回新字符串。原始值不变。
// str.replace(旧符号,新符号); 把str中的%替换成#
let str1 = '20%,50% OFF de Desconto 20%,50%Lancheiras';
// 只替换一次
// 20#,50% OFF de Desconto 20%,50%Lancheiras
console.log(str1.replace( '%', '#'));
// 正则可以批量替换
// 20#,50# OFF de Desconto 20#,50#Lancheiras
console.log(str1.replace( /\%/g, '#'));
let newStr=str1.replace( /\d{2}\%/g, function( item, index ){
let tmp = '';
tmp='<i>' + item + '</i>';
return tmp;
});
// 正则与函数配合,进行复杂替换
// <i>20%</i>,<i>50%</i> OFF de Desconto <i>20%</i>,<i>50%</i>Lancheiras
console.log(newStr);
string.replaceAll(searchValue, replacement)
:在字符串中查找匹配的子串,并替换与正则表达式匹配的子串,只能全部替换。返回新字符串。原始值不变。
- searchValue是搜索模式,可以是一个字符串,也可以是一个全局的正则表达式(带有g修饰符),正则表达式不带g,程序会报错。
- replacement是一个字符串,表示替换的文本,其中可以使用一些特殊字符串。
$&
:匹配的字符串。$
` :匹配结果前面的文本。$'
:匹配结果后面的文本。$n
:匹配成功的第n组内容,n是从1开始的自然数。这个参数生效的前提是,第一个参数必须是正则表达式。$$
:指代美元符号$。- replacement除了为字符串,也可以是一个函数,该函数的返回值将替换掉第一个参数searchValue匹配的文本。
- 第一个参数是捕捉到的匹配内容
- 第二个参数捕捉到是组匹配(有多少个组匹配,就有多少个对应的参数)。
- 倒数第二个参数是捕捉到的内容在整个字符串中的位置
- 最后一个参数是原字符串。
// str.replace(旧符号,新符号); 把str中的%替换成#
let str1 = '20%,50% OFF de Desconto 20%,50%Lancheiras';
// 全部替换
// 20#,50# OFF de Desconto 20#,50#Lancheiras
console.log(str1.replaceAll( '%', '#'));
// $& 表示匹配的字符串,即`b`本身
// 所以返回结果与原字符串一致
'abbc'.replaceAll('b', '$&')
// 'abbc'
// $` 表示匹配结果之前的字符串
// 对于第一个`b`,$` 指代`a`
// 对于第二个`b`,$` 指代`ab`
'abbc'.replaceAll('b', '$`')
// 'aaabc'
// $' 表示匹配结果之后的字符串
// 对于第一个`b`,$' 指代`bc`
// 对于第二个`b`,$' 指代`c`
'abbc'.replaceAll('b', `$'`)
// 'abccc'
// $1 表示正则表达式的第一个组匹配,指代`ab`
// $2 表示正则表达式的第二个组匹配,指代`bc`
'abbc'.replaceAll(/(ab)(bc)/g, '$2$1')
// 'bcab'
// $$ 指代 $
'abc'.replaceAll('b', '$$')
// 'a$c'
'aabbcc'.replaceAll('b', () => '_')
// 'aa__cc'
const str = '123abc456';
const regex = /(\d+)([a-z]+)(\d+)/g;
function replacer(match, p1, p2, p3, offset, string) {
return [p1, p2, p3].join(' - ');
}
str.replaceAll(regex, replacer)
// 123 - abc - 456
// 上面例子中,正则表达式有三个组匹配,所以replacer()函数的第一个参数match是捕捉到的匹配内容(即字符串123abc456),后面三个参数p1、p2、p3则依次为三个组匹配。
string.search()
: 查找与正则表达式相匹配的值首次出现的位置。原始值不变。跟indexOf功能一模一样,但是search方法的参数是正则表达式
let str1 = 'ancHLeiras';
let reg = /a/i;
let reg2 = /h/i;
// 0
console.log(str1.indexOf( 'a' ));
// 0
console.log(str1.search( reg ));
// -1
console.log(str1.indexOf( 'h' ));
// 3
console.log(str1.search( reg2 ));
string.includes()
: 查找字符串中是否包含指定的子字符串,返回布尔值。原始值不变。
string.startsWith()
: 查看字符串是否以指定的子字符串开头,返回布尔值。原始值不变。
string.endsWith()
: 判断当前字符串是否是以指定的子字符串结尾的(区分大小写),返回布尔值。原始值不变。
- 这三个方法都支持第二个参数,includes、startsWith表示开始搜索的位置直到字符串结束;endsWith参数代表个数(n),从字符串开始的前n个字符
let str1 = 'Hello world!';
// true
console.log( str1.startsWith( 'Hello' ) );
// true
console.log( str1.endsWith( '!' ) );
// true
console.log( str1.includes( 'o' ) );
// false
console.log( str1.startsWith( 'Hello', 6 ) );
// false
console.log( str1.endsWith( '!', 5 ) );
// true
console.log( str1.includes( 'o', 6 ) );
// false
console.log( str1.startsWith( 'Hello', 55 ) );
// true
console.log( str1.endsWith( '!', 55 ) );
// false
console.log( str1.includes( 'o', 55 ) );
// true
console.log( str1.startsWith( 'Hello', -6 ) );
// false
console.log( str1.endsWith( '!', -5 ) );
// true
console.log( str1.includes( 'o', -6 ) );
string.repeat()
: 复制字符串指定次数,并将它们连接在一起返回。返回新字符串。原始值不变。
- 参数如果是小数,会被取整。
- 参数是负数或者Infinity,会报错。
- 参数是字符串,则会先转换成数字。
let str1 = 'hello';
// hellohello ----- hello
console.log(str1.repeat( 2 ), '-----', str1 );
string.padStart()
: 如果某个字符串不够指定长度,会在头部补全。返回新字符串。原始值不变。
string.padEnd()
: 如果某个字符串不够指定长度,会在尾部补全。原始值不变。
let a = 'x';
let a1 = a.padStart(5, 'ab');
console.log(a, a1); // 'x' 'ababx'
let b = 'x';
let b1 = b.padStart(4, 'ab');
console.log(b, b1); // 'x' 'abax'
let c = 'x';
let c1 = c.padEnd(5, 'ab');
console.log(c, c1); // 'x' 'xabab'
let d = 'x';
let d1 = d.padEnd(4, 'ab');
console.log(d, d1); // 'x' 'xaba'
string.trim()
: 去除字符串两边的空白。返回新字符串。原始值不变。
- 空白符包括:空格、制表符 tab、换行符等其他空白符等。
- 不适用于 null, undefined, Number 类型。
let str1 = ' hel lo ';
// |hel lo|
console.log( '|' + str1.trim() + '|' );
string.trimStart()
: 消除字符串头部的空格,返回新字符串。
- 空白符包括:空格、制表符 tab、换行符等其他空白符等。
- 不适用于 null, undefined, Number 类型。
string.trimEnd()
: 消除尾部的空格,返回新字符串。
- 空白符包括:空格、制表符 tab、换行符等其他空白符等。
- 不适用于 null, undefined, Number 类型。
let a = ' abc ';
let a1 = a.trim();
console.log(`|${a}| |${a1}|`); //| abc | |abc|
let b = ' abc ';
let b1 = b.trimStart();
console.log(`|${b}| |${b1}|`); //| abc | |abc |
let c = ' abc ';
let c1 = c.trimEnd();
console.log(`|${c}| |${c1}|`); //| abc | | abc|
string.at()
: 方法接受一个整数作为参数,返回参数指定位置的字符,支持负索引(即倒数的位置)。
- 参数位置超出了字符串范围,at()返回undefined。
let str = 'hello';
console.log(str.at(1)); // "e"
console.log(str.at(-1)); // "o"
console.log(str.at(10)); // undefined
console.log(str.at(-10)); // undefined
分类:
JavaScript知识
, 面试题
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· AI技术革命,工作效率10个最佳AI工具