JS算法必备之String常用操作方法

简介: 这篇文章详细介绍了JavaScript中字符串的基本操作,包括创建字符串、访问特定字符、字符串的拼接、位置查找、大小写转换、模式匹配、以及字符串的迭代和格式化等方法。

MDN参考文档: String - JavaScript | MDN

①创建字符串

// var stringObject = new String('hello world')

var stringValue = 'hello world' // 其每一个实例都有一个length属性

console.log(stringValue.length) // 11

②字符方法

用于访问字符串中特点字符的方法:

1.charAt()

console.log(stringValue.charAt(1)) // 'e'

console.log(stringValue[1]) // 'e',用方括号[ ]访问字符

2.charCodeAt()

若想得到的不是字符而是字符编码:

console.log(stringValue.charCodeAt(1)) // '101'(即'e'的字符编码)

③字符串操作方法

1.concat():用于将一个或多个字符串拼接起来,返回拼接后的新字符串

var str = 'hello'

var result1 = str.concat(' world')

console.log(result1) // 'hello world'

var result2 = str.concat(' world' + '!')

console.log(result2) // 'hello world!'

在大多数情况下更喜欢使用加号操作符(+)拼接多个字符串

基于子字符串创建新字符串的方法:

2.slice()和substring():第一个参数指定子字符串的开始位置,第二个参数指定子字符串最后一个字符后面的位置。

若没有第二个参数,则将字符串末尾作为结束位置

var stringValue = 'hello world'

console.log(stringValue.slice(1, 5)) // 'ello'

console.log(stringValue.substring(1, 5)) // 'ello'

console.log(stringValue.substring(1)) // 'ello world'

3.substr():第一个参数指定子字符串的开始位置,第二个参数指定返回的字符个数。

若没有第二个参数,则将字符串末尾作为结束位置

console.log(stringValue.substr(2, 5)) // 'llo w'

console.log(stringValue.substr(2)) // 'llo world'

④字符串位置方法

1.indexOf():从字符串的开头向后搜索子字符串,返回第一个匹配子字符串的位置,若没有找到,则返回-1。

var stringValue = 'hello world'

console.log(stringValue.indexOf('o')) // 4

console.log(stringValue.indexOf('ello')) // 1

2.lastIndexOf():从字符串的末尾向前搜索子字符串,返回第一个匹配子字符串的位置,若没有找到,则返回-1。

console.log(stringValue.lastIndexOf('o')) // 7

两个方法还可以接收可选的第二个参数:表示从字符串中的哪个位置开始搜索

console.log(stringValue.indexOf('o', 6)) // 7

console.log(stringValue.lastIndexOf('o', 6)) // 4

⑤字符串迭代方法

var str = 'hello'

for (let i = 0; i < str.length; i++) {

  console.log(str\[i\]) // 字符串每项的值

}

for (const n of str) {

  console.log(n) // 字符串每项的值

}

for (const i in str) {

  console.log(i) // 字符串每项的索引值(string类型)

}

⑥trim()**方法**

创建一个字符串的副本,删除前置及后缀的所有空格。

var stringValue = ' hello world '

console.log(stringValue.trim()) // 'hello world'

⑦**includes()方法**

方法用于判断一个字符串是否包含在另一个字符串中,根据情况返回 true 或 false

var stringValue = 'hello world'

console.log(stringValue.includes('e')) // true

console.log(stringValue.includes('ello')) // true

console.log(stringValue.includes('eo')) // false

⑧startsWith**()方法**

方法用来判断当前字符串是否以另外一个给定的子字符串开头,并根据判断结果返回 true 或 false

var stringValue = 'hello world'

console.log('starts:', stringValue.startsWith('he')) // true

console.log('starts:', stringValue.startsWith('eo')) // false

字符串大小写转换方法

var stringValue = 'hello world'

console.log(stringValue.toLocaleUpperCase()) // 'HELLO WORLD'

console.log(stringValue.toUpperCase()) // 'HELLO WORLD'

console.log(stringValue.toLocaleLowerCase()) // 'hello world'

console.log(stringValue.toLowerCase()) // 'hello world'

Locale:是针对特定地区的实现,若不知道自己的代码在哪种语言环境中运行,还是使用针对地区的方法更稳妥一些。

⑨字符串模式匹配方法

1.match():只接收一个参数,正则表达式或者RegExp对象,结果会返回一个数组。

方法的行为在很大程度上有赖于 regexp 是否具有标志 g。如果 regexp 没有标志 g,那么 match() 方法就只能在 stringObject 中执行一次匹配。如果没有找到任何匹配的文本, match() 将返回 null。否则,它将返回一个数组,其中存放了与它找到的匹配文本有关的信息。

console.log(str.match(/ain/g)) // ['ain', 'ain', 'ain']

console.log(str.match(/ain/gi)) // ['ain', 'AIN', 'ain', 'ain']

console.log(str.match(/k/gi)) // null

2.search():只接收一个参数,用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串。

结果返回字符串中第一个匹配项的索引,若没有匹配项,则返回-1。

var stringValue = 'hello world'

console.log(stringValue.search('world')) // 6

console.log(stringValue.search(/WORLD/)) // -1

console.log(stringValue.search(/WORLD/i)) // 6

3.replace():替换子字符串的方法,接收两个参数:第一个参数是一个RegExp对象或者一个字符串(不会被转换成正则表达式),第二个参数是一个字符串或者一个函数。

var text = 'cat,bat,sat,fat'

var result = text.replace('at', 'ond')

console.log(result) // 'cond,bat,sat,fat'

// 提供一个正则表达式,并指定全局(g)标志

result = text.replace(/at/g, 'ond')

console.log(result) // 'cond,bond,sond,fond'

4.split():基于指定的分隔符将一个字符串分割成多个子字符串,并将结果放在一个数组中。分隔符可以说字符串或者一个RegExp对象,还可以接受第二个可选参数,用于指定数组的大小。

var colorText = 'red,blue,green,yellow'

var colors1 = colorText.split(',') // ['red', 'blue', 'green', 'yellow']

var colors2 = colorText.split(',', 2) // ['red', 'blue']

⑩localeCompare()**方法**

var stringValue = 'yellow'

// 具体返回的正数和负数未必是1和-1,需看实现

console.log(stringValue.localeCompare('brick')) // 1

console.log(stringValue.localeCompare('yellow')) // 0

console.log(stringValue.localeCompare('zoo')) // -1

⑪**fromCharCode()**方法

String构造函数本身还有一个静态方法:fromCharCode(),接收一个或多个字符编码,然后将它们转换成一个字符串

console.log(String.fromCharCode(104,101,108,108,111)) // 'hello'

相关文章
|
3月前
|
JavaScript 前端开发 程序员
前端原生Js批量修改页面元素属性的2个方法
原生 Js 的 getElementsByClassName 和 querySelectorAll 都能获取批量的页面元素,但是它们之间有些细微的差别,稍不注意,就很容易弄错!
|
12天前
|
JavaScript 算法 安全
深度剖析:共享文件怎么设置密码和权限的 Node.js 进阶算法
在数字化时代,共享文件的安全性至关重要。本文聚焦Node.js环境,介绍如何通过JavaScript对象字面量构建数据结构管理文件安全信息,包括使用`bcryptjs`库加密密码和权限校验算法,确保高效且安全的文件共享。通过实例代码展示加密与权限验证过程,帮助各行业实现严格的信息资产管理与协作。
|
29天前
|
JavaScript 前端开发 开发者
JavaScript字符串的常用方法
在JavaScript中,字符串处理是一个非常常见的任务。JavaScript提供了丰富的字符串操作方法,使开发者能够高效地处理和操作字符串。本文将详细介绍JavaScript字符串的常用方法,并提供示例代码以便更好地理解和应用这些方法。
50 13
|
27天前
|
存储 监控 算法
局域网网络管控里 Node.js 红黑树算法的绝妙运用
在数字化办公中,局域网网络管控至关重要。红黑树作为一种自平衡二叉搜索树,凭借其高效的数据管理和平衡机制,在局域网设备状态管理中大放异彩。通过Node.js实现红黑树算法,可快速插入、查找和更新设备信息(如IP地址、带宽等),确保网络管理员实时监控和优化网络资源,提升局域网的稳定性和安全性。未来,随着技术融合,红黑树将在网络管控中持续进化,助力构建高效、安全的局域网络生态。
44 9
|
3月前
|
监控 JavaScript Java
Node.js中内存泄漏的检测方法
检测内存泄漏需要综合运用多种方法,并结合实际的应用场景和代码特点进行分析。及时发现和解决内存泄漏问题,可以提高应用的稳定性和性能,避免潜在的风险和故障。同时,不断学习和掌握内存管理的知识,也是有效预防内存泄漏的重要途径。
208 52
|
2月前
|
监控 算法 JavaScript
基于 Node.js Socket 算法搭建局域网屏幕监控系统
在数字化办公环境中,局域网屏幕监控系统至关重要。基于Node.js的Socket算法实现高效、稳定的实时屏幕数据传输,助力企业保障信息安全、监督工作状态和远程技术支持。通过Socket建立监控端与被监控端的数据桥梁,确保实时画面呈现。实际部署需合理分配带宽并加密传输,确保信息安全。企业在使用时应权衡利弊,遵循法规,保障员工权益。
44 7
|
1月前
|
存储 监控 JavaScript
深度探秘:运用 Node.js 哈希表算法剖析员工工作时间玩游戏现象
在现代企业运营中,确保员工工作时间高效专注至关重要。为应对员工工作时间玩游戏的问题,本文聚焦Node.js环境下的哈希表算法,展示其如何通过快速查找和高效记录员工游戏行为,帮助企业精准监测与分析,遏制此类现象。哈希表以IP地址等为键,存储游戏网址、时长等信息,结合冲突处理与动态更新机制,确保数据完整性和时效性,助力企业管理层优化工作效率。
31 3
|
3月前
|
缓存 JavaScript 前端开发
JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用
本文深入讲解了 JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用。
80 5
|
3月前
|
JavaScript 前端开发
js中的bind,call,apply方法的区别以及用法
JavaScript中,`bind`、`call`和`apply`均可改变函数的`this`指向并传递参数。其中,`bind`返回一个新函数,不立即执行;`call`和`apply`则立即执行,且`apply`的参数以数组形式传递。三者在改变`this`指向及传参上功能相似,但在执行时机和参数传递方式上有所区别。
39 1
|
3月前
|
JavaScript 前端开发
.js方法参数argument
【10月更文挑战第26天】`arguments` 对象为JavaScript函数提供了一种灵活处理参数的方式,能够满足各种不同的参数传递和处理需求,在实际开发中具有广泛的应用价值。
69 7