字符串是每种编程语言的基本组成部分,而 JavaScript 具有许多强大的内置函数,可以让开发人员轻松处理字符串。
includes
includes
方法确定子字符串是否包含在较大的字符串中并返回 true
或者 false
。常用于搜索/解析的字符串是否匹配。
const arrayAuthors = ["DevPoint", "DevelopPoint"]; const author = "DevPoint"; console.log([].includes(author)); // false console.log(arrayAuthors.includes(author)); // true console.log([1, 2].includes(author)); // false
toUpperCase
toUpperCase
方法返回一个全部为大写字母的字符串。
const title = "Develop Point"; console.log(title.toUpperCase()); // DEVELOP POINT
toLocaleLowerCase
toLocaleLowerCase
方法返回一个全部为小写字母的字符串。
const title = "Develop Point"; console.log(title.toLocaleLowerCase()); // develop point
字符串遍历
字符串中 length
属性将返回字符串的长度。通过 .length
属性来对字符串进行遍历。
const string = "DevPoint"; for (let i = 0; i < string.length; i++) { console.log(string[i]); }
将可以看到依次输出 D
、d
、v
、p
、 o
、 i
、 n
、t
。
search
使用 search
方法在另一个字符串中搜索一个字符串,它将返回该字符串的索引,这个方法和 indexOf
方法的效果类似。
console.log("DevPoint".search("Point")); // 3 console.log("DevPoint Develop Point".search("e")); // 1 console.log("DevPoint".search("e")); // 1
indexOf
indexOf
方法用于查找字符串的第一个索引,要查找的字符或者字符串多次重复,方法只会返回第一次出现的索引值。
const getStringIndex = (str, searchStr) => str.indexOf(searchStr); console.log(getStringIndex("DevPoint", "v")); // 2 console.log(getStringIndex("DevPoint Develop Point", "P")); // 3 console.log(getStringIndex("DevPoint Develop Point", "Dev")); // 0 console.log(getStringIndex("DevPoint", "1")); // -1
slice
slice
方法截取字符串的一部分并在新字符串中返回截取的部分。slice
,方法接受两个参数:开始索引和结束索引。结果字符串是这两个索引之间的切片字符串,但末尾索引处的字符除外。slice
通常用于字符串的截取。
console.log("DevPoint".slice(0, 3)); // Dev console.log("DevPoint".slice(3, 7)); // Poin,不包含索引为 7 的字母 t
如果没有提供最后一个索引,slice
将继续查找直到字符串结束:
console.log("DevPoint".slice(3)); // Point
还可以使用负参数从字符串末尾开始对字符串进行截取,为负数话就是从右边开始数起。
console.log("DevPoint".slice(-5)); // Point console.log("DevPoint".slice(-5, -1)); // Poin
replace
replace
方法将字符串中的特定值替换为另一个值。
console.log("DevPoint".replace("Dev", "Develop ")); // Develop Point
concat
concat()
方法连接两个或多个字符串:
const str1 = "Develop"; const str2 = "Point"; const arrStr = [str1, " ", str2]; console.log(str1.concat(" ", str2)); // Develop Point console.log("".concat(...arrStr)); // Develop Point
trim
JavaScript 中的 trim()
会删除字符串两边的空格:
const str1 = " Develop "; console.log(str1.trim()); // Develop
split
split()
方法使用指定的分隔符字符串将一个 String 对象分割成子字符串数组,以一个指定的分割字串来决定每个拆分的位置。
const str = "The split() method takes"; const arrayWorlds = str.split(" "); console.log(arrayWorlds); // [ 'The', 'split()', 'method', 'takes' ]
lastIndexOf
lastIndexOf
方法返回指定文本在字符串中最后一次出现的索引,与 indexOf
的结果相反(查找的内容存在):
const getStringLastIndex = (str, searchStr) => str.lastIndexOf(searchStr); console.log(getStringLastIndex("DevPoint", "v")); // 2 console.log(getStringLastIndex("DevPoint Develop Point", "P")); // 17 console.log(getStringLastIndex("DevPoint Develop Point", "Dev")); // 9 console.log(getStringLastIndex("DevPoint", "1")); // -1
charAt
charAt
方法返回字符串中指定索引或位置处的字符。将前面字符串遍历使用 charAt
方法来实现,代码如下:
const string = "DevPoint"; for (let i = 0; i < string.length; i++) { console.log(string.charAt(i)); }
charCodeAt
charCodeAt
方法返回 unicode 字符串中指定索引处的字符。返回 0 到 65535 之间的整数,表示给定索引处的 UTF-16 代码单元。
const title = "Develop Point;"; console.log(title.charCodeAt(0)); // 68 console.log(title.toLocaleLowerCase().charCodeAt(0)); // 100
repeat
repeat
构造并返回一个新字符串,该字符串包含被连接在一起的指定数量的字符串的副本。
const title = "Develop Point;"; console.log(title.repeat(2)); // Develop Point;Develop Point;
match
match
方法检索返回一个字符串匹配正则表达式的结果。下面的示例在字符串中搜索所有大写字母。它返回与正则表达式匹配的值的字符串数组。
const title = "Develop Point;"; const regex = /[A-Z]/g; console.log(title.match(regex)); // [ 'D', 'P' ]
matchAll
matchAll
方法返回一个包含所有匹配正则表达式的结果及分组捕获组的迭代器。它不会创建一个包含所有匹配项的单个数组,而是创建一个迭代器。 和 match
相比,主要的区别是返回值的区别,而参数有细微的区别(参数 RegExp 必须是设置了全局模式 g
的形式,否则会抛出异常 TypeError)。
const title = "Develop Point;"; const regex = /[A-Z]/g; const result = title.matchAll(regex); console.log(result); // Object [RegExp String Iterator] {} console.log([...result]); // [ // [ 'D', index: 0, input: 'Develop Point;', groups: undefined ], // [ 'P', index: 8, input: 'Develop Point;', groups: undefined ] // ]
总结
JavaScript 中的字符串方法非常有用,了解它们也很重要,作为前端开发人员,很多时候会发现自己在使用它们。