JavaScript 字符串操作方法

更新日期: 2023-01-28 阅读: 1.3k 标签: 字符串 作者: 天行无忌

字符串是每种编程语言的基本组成部分,而 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 中的字符串方法非常有用,了解它们也很重要,作为前端开发人员,很多时候会发现自己在使用它们。

来自:https://juejin.cn/post/7193647854294925367


本文内容仅供个人学习、研究或参考使用,不构成任何形式的决策建议、专业指导或法律依据。未经授权,禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载,请保留原文来源信息,不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持!

链接: https://fly63.com/article/detial/12336

相关推荐

js中字符串截取的几种方式

众所周知,js提供了很多字符串截取的方式。下面主要介绍js中slice(),splice(),split(),substring(),substr()的使用和区别,主要介绍了JavaScript截取、切割字符串的技巧,需要的朋友可以参考

JavaScript:生成重复的字符串(字符串乘法)

看到一个题目要求写一个函数times,输出str重复num次的字符串。除了利用循环还有几种方法:递归,结合三元表达式更简洁。数组的 join() 方法。ES6的 repeat() 方法。ES6目前没有全部兼容。

js 字符串比较大小

数值是合乎常理的操作,其实字符串也可以比较大小;两个字符串比较大小,比较的是组成它们字符的ASCII码的大小,比较原则如下:比较的是字符的ASCII码的大小。

原生js去掉字符串2端空格Trim()方法总汇

在我们使用JavaScript编写脚本的时候,经常会遇到把字符串两边的空格进行清除,它不想其它语言会有内置方法函数处理,js需要我们自己代码来实现。如果用过jquery库的话,它提供了trim方法,我们可以直接使用。

JS判断字符串小括号是否成对合法

要判断()是否成对;运用栈的后进先出 的特点,定义一个空数组,作为栈;for循环遍历字符串,当遇到(的时候就把(添加到空数组最顶端,push方法,记录发现一个左括号;

js中String.prototype实现string过滤空格_字符串空格过滤

我们都知道prototype可以向对象上添加属性和方法,语法如下:object.prototype.name=value。这篇文章就是利用prototype,为字符串扩展过滤空格的方法

es6中新增的字符串方法

es6中新增的字符串方法:字符串模板用法${变量名}、字符串查找方法string.includes(要找得字符串)、检查字符串是否已xxx开头、字符串重复方法string.repeat(次数)、字符串填充string.padStart

js提取字符串中的数值

1.像生于1999年这样字符串中只含有一个整型数值的字符串,直接使用正则表达式将数字的字符删除掉就行:2.对于字符串中含有多数值,使用字符串的match方法,通过正则表达式提取字符串的所有数字(包含整数和小数):

ES6 字符串之模板字符串、标签模板、实用方法集

模板字符串:1.可写多行字符串 2.使用${}添加变量,模板字符串之中还能调用函数。标签模板的一个重要应用,就是过滤 HTML 字符串,防止用户输入恶意内容。

Js实现字符串压缩

字符串压缩。利用字符重复出现的次数,编写一种方法,实现基本的字符串压缩功能。比如,字符串aabcccccaaa会变为a2b1c5a3。若“压缩”后的字符串没有变短,则返回原先的字符串。你可以假设字符串中只包含大小写英文字母

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!