I am poor and inexperienced.

Js字符串方法(API总结与应用)


avatar
Lucky 2023-12-07 258

String API
在网络上我们每天都需要利用字符进行交流,间接说明我们应该掌握字符串的处理方式。这是前端开发中不可或缺的技能。以下是字符串方法的分类:

1、字符串查找与匹配
方法 说明
String.prototype.indexOf() 并返回指定子字符串第一次出现的索引。
String.prototype.match() 用于将正则表达式 regexp 与字符串匹配。
String.prototype.search() 搜索正则表达式 regexp 和调用字符串之间的匹配项。
我们重点关注一下indexOf方法。indexOf方法可以搜索子字符串第一次出现的索引。根据传入参数的不同搜索的结果分别以下有三种情况:

let a = “abc”;
a.indexOf(“c”) // 正确传参,输出结果:2
a.indexOf() // 不传参数,输出结果:”undefined”
a.indexOf(“d”) // 传入参数错误或子字符串在字符串中找不到,输出结果:-1
match方法传入一个正则表达式作为参数,与search方法的区别是:match方法会返回结果分为两种情况:若正则表达式设为全局匹配g会返回一个匹配的子字符串结果(数组形式),若未设定全局匹配则会返回一个有特定结构的结果数组。如果都没匹配成功则返回null。search方法则会返回首次匹配字符串的索引,不匹配返回-1。

let a = “AbCdEfG”
let regex1 = /[A-Z]/g // 设定全局匹配
a.match(regex1) // 输出结果:[‘A’, ‘C’, ‘E’, ‘G’]
let regex2 = /[A-Z]/ // 为设定全局匹配
a.match(regex2) // 输出结果:[‘A’, index: 0, input: ‘AbCdEfG’, groups: undefined]

2、字符串替换
方法 说明
String.prototype.replace() 用于使用 replaceWith 替换出现的 searchFor。
应用场景:可以做字符替换,replace方法接收两个参数。第一个参数可以是正则表达式或字符串,第二个参数是要替换的内容。replace方法在字符串匹配成功后,会进行替换。替换如下:

let str = ‘My name is Jelly’;
str.replace(‘Jelly’, ‘Mary’) // 输出结果: ‘My name is Mary’

3、字符串合并
方法 方法
String.prototype.concat() 合并两个(或更多)字符串的文本并返回一个新字符串。
字符串的concat方法跟数组的concat方法操作基本相同。用于字符串的合并操作。

4、字符串首尾空格去除
方法 说明
String.prototype.trim() 修剪字符串开头和结尾的空格。
String.prototype.trimStart() 修剪字符串开头的空格。
String.prototype.trimEnd() 修剪字符串结尾的空格。
应用场景:去掉字符串的首尾空格,如下:

let str = ‘ Hello, World ‘;
str.trim(); // 输出结果:’Hello, World’

5、字符串大小写转化
方法 说明
String.prototype.toLowerCase() 字符串中的字符将转换为小写。
String.prototype.toUpperCase() 字符串中的字符将转换为大写。
应用场景:以上的字符串方法可以应用于字母的大小写替换,可以来做一道题。实现小驼峰式命名法:将一个英语短语转换为小驼峰式命名。例如:first name => firstName

function toConvertCase(str) {
let result = ” // 存储新字符串,用于合并新的字符
let count = 0 // 记录初始状态,因为第一个字母需要小写
let space = false // 记录字符状态,是否出现已经特殊字符
for (let i = 0; i < str.length; i++) {
if (str[i].search(/^[A-Za-z]+$/) === 0) {
if (count === 0 && space === false) {
count++
} // 此时count恒等于1,根据下面的三元表达式第一次出现的字母为小写
result = space === true && count !== 0
? result.concat(str[i].toUpperCase())
: result.concat(str[i].toLowerCase())
space = false // 第一次出现的字母和首字母大写后的字母都为小写,设为false
} else {
space = true
// 出现特殊字符space设为true。下一次若是字母则三元表达式的值为true,新字符串合并首字母大写。
}
}
return result
}
// 短语输入测试
let a = toConvertCase(‘!@# fiRst %^&*( nAmE !@#$ ‘)
let b = toConvertCase(‘423432 SEcOnd@3423423 NaME’)
let c = toConvertCase(‘@ThIrd-3NAmE’)
console.log(a) // 输出结果:firstName
console.log(b) // 输出结果:secondName
console.log(c) // 输出结果:thirdName

只要输入有特殊字符间隔的短语就能返回小驼峰式命名,容错率还是非常高的。获取的字符串特征如下:

短语之间会存在特殊字符间隔,利用这个作为实现切入点。
第一个单词的首字母为小写,后面的单词首字母都为大写。
可以根据上面的字符串特征进行解题,不过上面的使用好像有点超纲了。我们还是重点关注它怎么用就行了。

6、字符串删除与截取
方法 说明
String.prototype.slice() 提取字符串的一部分并返回一个新字符串。
String.prototype.substring() 返回一个新字符串,其中包含来自(或之间)指定索引(或多个索引)的调用字符串的字符。
字符串的slice方法跟数组的slice方法操作基本相同。接收两个参数为开始和结束位置(不包括)进行字符提取。我们重点关注substring方法,这个是最常用的字符串截取操作。substring方法接收两个参数,这里暂且设为start和end两个参数,分别代表开始和结束位置(不包括)的字符。使用规则如下:

start === end 返回一个空字符串
省略end参数,substring方法直接提取到末尾
任一参数小于0或为NaN,会当作0进行截取
任一参数大于字符串长度,则会截取到array.length
start > end 会进行参数调换再截取字符串
let a = “abcdefg”
a.substring(2, 2) // 输出结果:”
a.substring(2) // 输出结果:’cdefg’
a.substring(2, NaN) // 输出结果:’ab’
a.substring(8, 2) // 输出结果:’cdefg’
a.substring(4, 2) // 输出结果:’cd’

原文链接