问题

如何去判断 JS 字符串中含某个字符串?

回答
怎么判断一个 JavaScript 字符串里是不是包含着另一个特定的字符串?这个问题看似简单,但背后其实有好几种方法,各有优劣。今天咱就来好好掰扯掰扯,让你彻底搞懂。

核心思路:搜索与匹配

归根结底,判断一个字符串是否包含另一个字符串,本质上就是在“大海捞针”。我们要做的就是在这个大字符串里,找到那个小字符串的踪迹。JavaScript 提供了几种不同的“工具”来帮我们实现这个目标。

方法一:`String.prototype.includes()` 最直观、最常用

这应该是目前最推荐、也是最简洁的字符串包含判断方法了。

它长什么样?

```javascript
let mainString = "你好,世界!这是一个包含了‘世界’的句子。";
let subString = "世界";

if (mainString.includes(subString)) {
console.log("主字符串包含了‘世界’!"); // 会执行
} else {
console.log("主字符串不包含‘世界’。");
}

let anotherSubString = "地球";
if (mainString.includes(anotherSubString)) {
console.log("主字符串包含了‘地球’!");
} else {
console.log("主字符串不包含‘地球’。"); // 会执行
}
```

详细解读:

`mainString.includes(subString)`:这是最核心的部分。`includes()` 方法会检查 `mainString` 是否包含 `subString`。
返回值: 如果 `mainString` 找到了 `subString`,它会返回 `true`;如果找不到,就返回 `false`。
区分大小写: 需要注意的是,`includes()` 是区分大小写的。也就是说,"Hello" 和 "hello" 在它看来是两个不同的字符串。

```javascript
let greeting = "Hello World";
console.log(greeting.includes("hello")); // false (因为大小写不匹配)
console.log(greeting.includes("Hello")); // true
```
可选的第二个参数:开始位置 `includes()` 方法还有一个可选的第二个参数,用来指定开始搜索的位置。

```javascript
let sentence = "apple banana apple orange";
console.log(sentence.includes("apple")); // true (从开头找到第一个)
console.log(sentence.includes("apple", 6)); // true (从索引 6 开始找,找到了第二个 "apple")
console.log(sentence.includes("apple", 13)); // false (从索引 13 开始找,找不到 "apple")
```
这在你需要从特定位置之后才开始查找时非常有用。

优点:

可读性极强: 方法名 `includes` 一目了然,非常容易理解。
简洁: 代码量最少,最直接。
标准: 这是 ECMAScript 2015 (ES6) 引入的标准方法,兼容性很好。

缺点:

只能判断包含: 它只能告诉你“是不是包含”,而不能告诉你“在哪里包含”。如果你需要知道子字符串的具体位置,就得用其他方法了。

方法二:`String.prototype.indexOf()` 老牌但依然有用

在 `includes()` 出现之前,`indexOf()` 是判断字符串包含最常用的方法。它不仅能判断是否包含,还能告诉你第一个匹配项的位置。

它长什么样?

```javascript
let mySentence = "JavaScript 是一种强大的脚本语言。";
let keyword = "脚本";

if (mySentence.indexOf(keyword) !== 1) {
console.log("找到了‘脚本’!"); // 会执行
} else {
console.log("没找到‘脚本’。");
}

let anotherKeyword = "Python";
if (mySentence.indexOf(anotherKeyword) !== 1) {
console.log("找到了‘Python’!");
} else {
console.log("没找到‘Python’。"); // 会执行
}
```

详细解读:

`mySentence.indexOf(keyword)`:这个方法会在 `mySentence` 中查找 `keyword` 第一次出现的位置。
返回值:
如果找到了,它会返回 `keyword` 在 `mySentence` 中第一次出现的索引(从 0 开始)。
如果没有找到,它会返回 `1`。
判断包含的技巧: 正是因为找不到时返回 `1`,所以我们通常用 `indexOf(keyword) !== 1` 来判断是否包含。
区分大小写: 和 `includes()` 一样,`indexOf()` 也是区分大小写的。

```javascript
let text = "Programming";
console.log(text.indexOf("pro")); // 1
console.log(text.indexOf("Pro")); // 0
```
可选的第二个参数:开始位置 `indexOf()` 同样接受一个可选的第二个参数,指定搜索的起始索引。

```javascript
let data = "abcdefabcghi";
console.log(data.indexOf("abc")); // 0
console.log(data.indexOf("abc", 4)); // 8 (从索引 4 开始查找,找到第二个 "abc")
```

优点:

功能更强: 不仅能判断包含,还能获取首次出现的位置,这在很多场景下非常有用。
兼容性极好: `indexOf()` 是 JavaScript 非常老的方法,几乎所有的 JS 环境都支持。

缺点:

可读性稍差: 相较于 `includes()`,`indexOf(sub) !== 1` 这个判断条件稍微绕一点,可读性不如 `includes()` 直接。

方法三:`String.prototype.search()` 正则的强大之处

如果你需要进行更复杂的匹配,比如忽略大小写,或者匹配某种模式(例如,判断字符串是否包含数字、特殊字符等),那么 `search()` 方法就是你的不二之选。它接受一个正则表达式作为参数。

它长什么样?

```javascript
let logMessage = "ERROR: Something went wrong in module 'Auth'";
let errorPattern = /ERROR/; // 一个简单的正则表达式,匹配 "ERROR"

if (logMessage.search(errorPattern) !== 1) {
console.log("日志中包含错误信息!"); // 会执行
} else {
console.log("日志中没有错误信息。");
}

// 忽略大小写匹配
let caseInsensitiveText = "JavaScript";
if (caseInsensitiveText.search(/javascript/i) !== 1) { // 'i' 标志表示忽略大小写
console.log("找到了‘javascript’(忽略大小写)!"); // 会执行
} else {
console.log("没找到‘javascript’(忽略大小写)。");
}

// 匹配包含数字的字符串
let mixedString = "version_1.2.3";
if (mixedString.search(/d/) !== 1) { // 'd' 匹配任何数字
console.log("字符串包含数字!"); // 会执行
} else {
console.log("字符串不包含数字。");
}
```

详细解读:

`logMessage.search(errorPattern)`:这个方法会在 `logMessage` 中查找由 `errorPattern` 定义的正则表达式的第一个匹配项。
返回值:
如果找到了匹配项,它会返回该匹配项在原字符串中第一次出现的索引。
如果没有找到匹配项,它会返回 `1`。
核心特点: 它的参数是一个正则表达式。这意味着你可以使用正则表达式的各种强大功能:
字符类: `[abc]` (匹配 a, b, 或 c), `[az]` (匹配小写字母)
预定义字符类: `d` (数字), `s` (空格), `w` (字母、数字、下划线)
量词: `` (0 或多次), `+` (1 或多次), `?` (0 或 1 次), `{n}` (恰好 n 次)
锚点: `^` (行首), `$` (行尾)
标志: `i` (忽略大小写), `g` (全局匹配 但 `search` 只返回第一个匹配的索引), `m` (多行匹配)
与 `indexOf` 的区别: 尽管它们在返回索引和 `1` 的逻辑上相似,但 `search` 的参数是正则表达式,`indexOf` 的参数是字符串。

优点:

功能最强大: 可以进行复杂的模式匹配,实现各种高级查找需求,例如忽略大小写、匹配数字、特殊字符等。
灵活性高: 结合正则表达式,可以解决很多 `includes` 和 `indexOf` 无法直接完成的任务。

缺点:

可读性相对较低: 如果不熟悉正则表达式,`search()` 的使用会比较困难,代码也可能不易理解。
性能考量: 对于简单的字符串包含判断,使用正则表达式可能会比 `includes()` 或 `indexOf()` 稍慢一些(虽然在大多数情况下差异微乎其微,但如果是在极度频繁的循环中,需要注意)。
只能返回第一个匹配项的索引: 和 `indexOf` 一样,它也只返回第一个匹配项的位置。

方法四:`String.prototype.match()` 提取匹配内容,顺带判断

`match()` 方法也是使用正则表达式,但它的主要目的是返回匹配的子字符串(或一个包含所有匹配项的数组),而不仅仅是判断是否包含。但我们可以通过它的返回值来间接判断。

它长什么样?

```javascript
let content = "The quick brown fox jumps over the lazy dog.";
let regex = /fox/;

if (content.match(regex)) { // 如果 match() 返回的不是 null,就说明找到了
console.log("找到了‘fox’!"); // 会执行
} else {
console.log("没找到‘fox’。");
}

// 全局匹配,提取所有匹配项
let sentenceWithWords = "apple banana apple orange apple";
let allApples = sentenceWithWords.match(/apple/g); // 'g' 标志表示全局匹配

if (allApples) {
console.log(`找到了 ${allApples.length} 个‘apple’。`); // 会执行,输出 3
console.log("匹配到的所有‘apple’:", allApples); // ["apple", "apple", "apple"]
} else {
console.log("没找到‘apple’。");
}
```

详细解读:

`content.match(regex)`:这个方法用 `regex`(一个正则表达式)去匹配 `content`。
返回值:
如果没有全局标志 (`g`),并且找到了匹配项,它会返回一个数组,其中包含:
`[0]`: 第一个匹配的字符串。
`index`: 匹配项在原字符串中的起始索引。
`input`: 原字符串。
`groups` (如果有捕获组的话):捕获组匹配的结果。
如果没有全局标志 (`g`),并且没有找到匹配项,它会返回 `null`。
如果有全局标志 (`g`),并且找到了匹配项,它会返回一个数组,包含所有匹配到的字符串(不包含 `index`、`input` 等信息)。
如果有全局标志 (`g`),并且没有找到匹配项,它会返回 `null`。
判断包含的技巧: 由于 `match()` 在找不到时返回 `null`,所以我们可以通过检查其返回值是否为 `null` 来判断是否包含。`if (content.match(regex))` 就是一个非常简洁的写法,因为 `null` 在布尔上下文中被视为 `false`。

优点:

提取匹配内容: 这是 `match()` 的核心优势,可以一次性获取所有或第一个匹配的字符串。
与正则表达式结合: 和 `search()` 一样,可以使用正则表达式的强大功能。

缺点:

不直接用于判断包含: 它的主要目的不是简单地判断包含,使用它来判断包含会显得有点“杀鸡用牛刀”,并且代码相对 `includes()` 或 `indexOf()` 来说不够直接。
返回值形式复杂: 在没有全局标志时,返回的是一个包含额外信息的数组,需要理解其结构。

总结与选择

那么,到底该用哪个方法呢?这取决于你的具体需求:

1. 最简单、最直接的判断包含:
`String.prototype.includes(substring)`
推荐场景: 当你只需要知道一个字符串是否包含另一个字符串,而且不关心位置、不区分大小写(除非你用 `search` 和 `i` 标志)时。这是最现代、最清晰的选择。

2. 判断包含,并且需要知道第一次出现的位置:
`String.prototype.indexOf(substring)`
推荐场景: 当你需要判断包含,同时又想知道子字符串第一次出现的确切位置时。或者你在一个不支持 ES6 的老旧环境中工作。

3. 复杂的模式匹配(忽略大小写、匹配数字等):
`String.prototype.search(regex)`
推荐场景: 当你需要利用正则表达式的强大功能来判断包含时,例如忽略大小写、匹配特定模式(如是否包含数字)。

4. 提取匹配到的字符串(顺带判断):
`String.prototype.match(regex)`
推荐场景: 当你的主要目的是提取匹配到的子字符串(一个或所有),而判断包含只是附加需求时。

一个实际的比喻:

`includes()`:就像你问朋友,“这本书里有没有提到‘猫’这个词?” 朋友回答“有”或“没有”。
`indexOf()`:就像你问朋友,“这本书里‘猫’这个词第一次出现在第几页?” 朋友回答“第 55 页”或者“没找到”。
`search()`:就像你请一位侦探,问他,“这本书里有没有提到‘猫’,而且它在段落开头,并且不区分大小写?” 侦探会告诉你“有,在第 10 页的段落开头”,或者“没有”。
`match()`:就像你请一位文献管理员,问他,“这本书里所有提到‘猫’的地方,都给我标记出来。” 管理员会给你一张包含所有“猫”出现位置的列表。

希望这番详细的讲解,能够帮助你清晰地理解 JavaScript 中判断字符串包含的各种方法,并能在实际开发中做出最合适的选择!

网友意见

user avatar

JS如何判断字符串或数组包含内容?

       const array1 = [1, 2, 3];  console.log(array1.includes(2)); // 预期输出: true  const pets = ['cat', 'dog', 'bat'];  console.log(pets.includes('cat')); // 预期输出: true  console.log(pets.includes('at')); // 预期输出: false  const string1 = "taeas,wiki"  console.log(string1.includes('taeas')); // 预期输出: true     

我建了一个前端小白交流群,私信我,进入交流群。我会给大家分享我收集整理的各种学习资料,组织大家一起做项目练习,帮助大家匹配一位学习伙伴互相监督学习,欢迎加入

作者:eyan

原文链接:JS如何判断字符串或数组包含内容?

类似的话题

  • 回答
    怎么判断一个 JavaScript 字符串里是不是包含着另一个特定的字符串?这个问题看似简单,但背后其实有好几种方法,各有优劣。今天咱就来好好掰扯掰扯,让你彻底搞懂。 核心思路:搜索与匹配归根结底,判断一个字符串是否包含另一个字符串,本质上就是在“大海捞针”。我们要做的就是在这个大字符串里,找到那个.............
  • 回答
    判断一本书是否值得一读,这绝对是一门艺术,也是一个持续摸索的过程。毕竟,每个人都有自己的口味和偏好,不可能有一套放之四海而皆准的“圣经”告诉你该读什么。但我可以分享一些我个人摸索出来的,比较“接地气”的方法,希望能帮你拨开迷雾,找到那些能触动你灵魂的书。第一步:初识——“一见钟情”的蛛丝马迹有时候,.............
  • 回答
    要判断一个女生是否喜欢你,这可不是一项简单的任务,就像猜谜语一样,需要你细心观察、耐心体会。毕竟,每个人表达情感的方式都不同,没有绝对的标准答案。但别担心,我为你整理了一些可能存在的信号,你可以结合自己的情况,去感受和判断。一、肢体语言的秘密花园肢体语言是内心最真实的写照,很多时候比语言更直接。 .............
  • 回答
    .......
  • 回答
    去小公司面试,想判断它有没有前途,这活儿可得仔细琢磨。毕竟小公司就像一颗刚埋下的种子,可能长成参天大树,也可能就此枯萎。面试官不是在考你,你也不是在做考试,这更像是一场相互的“考察”。下面就给你掰扯掰扯,看公司有没有那股子“向上”劲儿。一、 从“听”的角度:听公司在说什么,怎么说1. 产品/服务:.............
  • 回答
    .......
  • 回答
    什么是真正的朋友?这个问题我思考了很久,也经历了很多。对我来说,真正的朋友不仅仅是那些和你一起笑的人,更是那些在你跌倒时愿意伸出手,在你迷茫时给予指引,在你犯错时敢于说真话的人。他们是你生命中的那束光,在你漆黑的时候,照亮你前行的路。朋友的定义,在我看来,是一种基于相互理解、信任和支持的关系。它不是.............
  • 回答
    作为一名面试官,要判断一个面试者在深度学习领域的深浅,我会采取一套相对全面且注重实践的方法。我不会仅仅依赖简历上那些听起来光鲜的词汇,而是要深入挖掘他们对概念的理解、解决问题的能力以及实际操作经验。一、 背景了解与基础知识摸底:首先,我会从他们的项目经历入手。这不仅仅是看他们列出了多少个项目,更重要.............
  • 回答
    这确实是一个极度艰难和令人恐惧的困境,在法律上,它涉及到“紧急避险”的原则,但具体如何判处,会非常复杂,并且取决于多个关键因素。我将尽量详细地为你梳理这个过程和可能的结果,并尽量用一种更贴近生活的方式来讲述,就像是在跟人解释一个棘手的问题一样。首先,我们要明白,法律在处理这类极端情况时,是尝试在保护.............
  • 回答
    判断自己是否适合成为一名自由职业者,以及自由职业者的核心技能,是一个需要深入思考的问题。这不仅仅是关于选择一种工作方式,更是关于一种生活方式的转变。下面我将详细阐述这两个方面: 如何判断自己是否适合成为一名自由职业者?判断是否适合成为一名自由职业者,需要从多个维度进行自我审视,包括你的性格特质、工作.............
  • 回答
    判断一部作品是“反战”还是“反战败”,需要深入剖析其核心立意、叙事角度、人物塑造以及情感表达。两者虽然都涉及战争,但其出发点和落脚点截然不同。核心区别: 反战 (Antiwar): 根本上反对战争本身,认为战争是残酷的、不人道的、毁灭性的,不应发生。其批判对象是战争行为、战争的根源、战争带来的痛.............
  • 回答
    判断一个外国人夸中国是发自真心还是“财富密码”,确实是一个复杂但有趣的问题。这需要我们运用观察力、分析能力,并结合对不同文化背景的理解。下面我将详细阐述如何从多个维度去辨别:核心原则: 证据与逻辑: 真心的赞美通常有具体的事实支撑,逻辑清晰。而“财富密码”式的赞美往往流于表面,缺乏深度。 动.............
  • 回答
    判断一个西方人所处的社会阶层是一个复杂的过程,因为它涉及多种相互关联的因素,并且存在地域和文化上的差异。西方社会不像某些社会那样有明确的、制度化的等级划分,而是更加流动和多元。然而,我们可以通过观察和分析以下几个关键方面来大致判断一个人的社会阶层:一、 经济资本 (Economic Capital).............
  • 回答
    判断一个人的技术是否成熟是一个多维度、需要细致观察和评估的过程,没有绝对的标准,但可以从以下几个方面来综合考量:一、 技术深度与广度(基础与应用) 扎实的基础知识: 理论基础牢固: 对所处技术领域的核心概念、原理、算法有深刻的理解,而不仅仅是停留在调用API层面。比如,一个后端开发者.............
  • 回答
    这个问题触及了人们内心深处一个敏感又复杂的话题。当一个人说自己“抑郁”时,背后可能藏着真实病痛的折磨,也可能掺杂着一些其他的动机。要区分这其中的差异,关键在于理解“抑郁”本身是个非常具体的疾病诊断,而不是一个可以随意套用的标签。装抑郁,或者说故意夸大或编造抑郁症状,通常是为了获取某些利益,比如逃避责.............
  • 回答
    要判断一个人是否具有“文科天赋”,其实更像是在观察他对语言、思想、文化以及与人交流的某种天然亲近感和敏感度。这并非一蹴而就的测试,而是一种需要时间去体察的特质。首先,我们要明白,所谓的“文科天赋”并不是说一个人必须立刻出口成章,或者写出惊世骇俗的文章。它更多的是一种内在的倾向和能力,体现在以下几个方.............
  • 回答
    洞察核心,审视全局:如何判断专利的单一性专利的单一性,简单来说,就是指一项专利申请是否涵盖了一个或一组紧密相关的发明。这是一个至关重要的概念,不仅影响专利申请能否获得授权,更关乎专利的有效性和保护范围。一旦专利被认定为不具备单一性,审查员可能会要求申请人进行分案,或者直接驳回部分或全部权利要求,这无.............
  • 回答
    区分猫咪是真的在搏斗还是在嬉闹,这确实是个大学问,很多铲屎官都头疼过这个问题。不过别担心,掌握一些关键的观察点,你就能像个经验丰富的猫咪行为专家一样了。下面我给你好好说道说道,保证让你明明白白。首先,要明确一个基本概念:猫咪的打斗,无论真假,都是它们交流的一种方式。 就像我们人类有时候会开玩笑“动手.............
  • 回答
    判断一项发明是否应该申请专利,这可不是一项拍脑袋就能决定的事情,它涉及到对发明本身、市场环境以及自身战略的全面评估。说实话,很多人拿到一个绝妙的点子,就想着赶紧去申请专利,但实际上,专利申请耗时耗力耗钱,并非所有发明都值得为此付出。那么,我们究竟该怎么做才能做出明智的决定呢?我这里给你掰开了揉碎了聊.............
  • 回答
    判断一个人是否真的有钱还是在“装”,这确实是个挺有意思但又有点复杂的话题。因为“有钱”本身有很多层含义,有的是我们肉眼可见的财富,有的是藏在背后的底气。而且人嘛,有时候也需要一点面子,所以偶尔“装”一下也未尝不可。不过,如果你想看透一些,可以从以下几个方面去留意:一、 生活方式与消费习惯:细节是魔鬼.............

本站所有内容均为互联网搜索引擎提供的公开搜索信息,本站不存储任何数据与内容,任何内容与数据均与本站无关,如有需要请联系相关搜索引擎包括但不限于百度google,bing,sogou

© 2025 tinynews.org All Rights Reserved. 百科问答小站 版权所有