js怎么判断字符串是否包含子串

判断字符串是否包含子串最推荐使用includes()，因其语义清晰且直接返回布尔值；2. 若需获取子串位置或兼容旧浏览器，则选用indexof()，通过返回值是否为-1判断存在性；3. 对于复杂模式匹配或不区分大小写的查找，应使用正则表达式，其中test()方法适合布尔判断，match()可返回匹配详情；4. 实现不区分大小写查找时，可统一转换大小写后比较，或更优地使用正则表达式i标志；5. 需注意空字符串始终被视为包含、长字符串高频操作的性能影响、旧浏览器对includes()不支持及复杂unicode字符的处理限制，选择方法时应权衡需求、可读性与性能，最终方案需完整考虑场景并避免常见陷阱。

在JavaScript中判断一个字符串是否包含另一个子串，我们通常会用到几种内置方法：

String.prototype.includes()

String.prototype.indexOf()

解决方案

判断字符串是否包含子串，最直接且现代的方式是使用

includes()

indexOf()

以下是具体的实现方式：

1. 使用

String.prototype.includes()

这是ES6引入的方法，也是我个人最推荐的，因为它语义最清晰，直接返回一个布尔值，表明是否找到了子串。

const mainString = "Hello, world! Welcome to JavaScript.";
const subString1 = "world";
const subString2 = "TypeScript";

console.log(mainString.includes(subString1)); // true
console.log(mainString.includes(subString2)); // false

// 也可以指定开始搜索的位置
console.log(mainString.includes("world", 10)); // false (从索引10开始，"world"在前面)

2. 使用

String.prototype.indexOf()

这是一个历史悠久的方法，如果找到子串，它会返回子串首次出现的索引位置；如果没有找到，则返回

-1

const mainString = "Hello, world! Welcome to JavaScript.";
const subString1 = "world";
const subString2 = "TypeScript";

console.log(mainString.indexOf(subString1)); // 7 (子串"world"从索引7开始)
console.log(mainString.indexOf(subString2)); // -1

// 判断是否包含
if (mainString.indexOf(subString1) !== -1) {
    console.log("包含子串:", subString1);
}

// 同样可以指定开始搜索的位置
console.log(mainString.indexOf("world", 10)); // -1

3. 使用正则表达式 (

RegExp.prototype.test()

String.prototype.match()

正则表达式提供了最强大的模式匹配能力，尤其当你需要进行复杂匹配（如不区分大小写、匹配多种模式等）时，它几乎是唯一的选择。

• RegExp.prototype.test()

  登录后复制
  : 这是最适合判断是否包含的方法，因为它只返回一个布尔值，效率高。

  const mainString = "Hello, world! Welcome to JavaScript.";
  const pattern1 = /world/; // 匹配"world"
  const pattern2 = /TypeScript/; // 匹配"TypeScript"
  
  console.log(pattern1.test(mainString)); // true
  console.log(pattern2.test(mainString)); // false
  
  // 不区分大小写匹配
  const caseInsensitivePattern = /javascript/i; // 'i' 标志表示不区分大小写
  console.log(caseInsensitivePattern.test(mainString)); // true

  登录后复制

• String.prototype.match()

  登录后复制
  : 这个方法返回一个数组，包含所有匹配的结果（如果使用

  g

  登录后复制
  全局标志），或者

  null

  登录后复制
  如果没有找到。虽然也能用来判断，但通常比

  test()

  登录后复制
  返回更多信息，如果只需要判断是否存在，

  test()

  登录后复制
  更直接。

  const mainString = "Hello, world! Welcome to JavaScript.";
  const pattern1 = /world/;
  const pattern2 = /TypeScript/;
  
  console.log(mainString.match(pattern1)); // ["world", index: 7, input: "...", groups: undefined]
  console.log(mainString.match(pattern2)); // null
  
  if (mainString.match(pattern1)) {
      console.log("包含子串 (通过match):", pattern1);
  }

  登录后复制

JavaScript中

includes()

登录后复制

、

indexOf()

登录后复制

和正则表达式，我该如何选择？

在我看来，选择哪种方法，确实是一个需要结合场景和个人偏好的问题。我经常会遇到这样的决策点。

如果你只是想简单地知道“有没有”某个子串，而且你的目标环境支持ES6（现在绝大多数现代浏览器和Node.js都支持），那么

String.prototype.includes()

!== -1

而

String.prototype.indexOf()

-1

indexOf()

indexOf()

至于正则表达式，那简直是字符串匹配领域的瑞士军刀。如果你的需求不仅仅是简单的子串匹配，比如你需要：

• 不区分大小写地查找（例如，查找"javascript"而不论大小写）。
• 查找符合特定模式的字符串（例如，查找所有数字、邮箱地址、URL等）。
• 查找多个可能的子串中的任意一个。
• 替换匹配到的模式。

这时候，

includes()

indexOf()

includes()

indexOf()

如何在JavaScript中实现不区分大小写的子串查找？

实现不区分大小写的子串查找，这在实际开发中非常常见，比如搜索功能，用户输入“apple”，你希望也能匹配到“Apple”或者“APPLE”。这里有几种方法，我通常会根据具体情况来选择。

1. 使用

toLowerCase()

toUpperCase()

阿里云-虚拟数字人

阿里云-虚拟数字人是什么？ ...

2

查看详情

这是最直观也最容易理解的方法，适用于

includes()

indexOf()

const mainString = "Hello, JavaScript! Welcome to My Website.";
const searchLower = "javascript";
const searchUpper = "JAVASCRIPT";

// 转换为小写后使用 includes()
console.log(mainString.toLowerCase().includes(searchLower.toLowerCase())); // true
console.log(mainString.toLowerCase().includes(searchUpper.toLowerCase())); // true

// 转换为大写后使用 indexOf()
console.log(mainString.toUpperCase().indexOf(searchLower.toUpperCase()) !== -1); // true
console.log(mainString.toUpperCase().indexOf(searchUpper.toUpperCase()) !== -1); // true

这种方法的优点是简单易懂，兼容性好。但缺点是，如果你的主字符串非常长，或者你需要进行大量的查找操作，每次都对字符串进行

toLowerCase()

toUpperCase()

2. 使用正则表达式的

i

这是处理不区分大小写匹配的“王道”方法，也是我个人最推荐的，尤其当你不只是判断包含，还可能涉及到更复杂的模式匹配时。正则表达式提供了一个

i

const mainString = "Hello, JavaScript! Welcome to My Website.";
const pattern = /javascript/i; // 'i' 标志表示不区分大小写

console.log(pattern.test(mainString)); // true
console.log(mainString.match(pattern)); // ["JavaScript", index: 7, input: "...", groups: undefined]

const anotherPattern = /website/i;
console.log(anotherPattern.test(mainString)); // true

使用正则表达式的

i

/js(cript)?/i

toLowerCase()

JavaScript查找子串时，有哪些常见的陷阱或性能考量？

在JavaScript中查找子串，虽然看似简单，但在实际开发中，确实会遇到一些需要注意的细节，甚至是一些不易察觉的“坑”，以及在特定场景下需要考虑的性能问题。

1. 空字符串的“陷阱”

这是一个我偶尔会忽略，但一旦遇到就可能导致逻辑错误的小细节。当你要查找的子串是一个空字符串（

""

includes()

indexOf()

const myString = "hello world";

console.log(myString.includes(""));    // true
console.log(myString.indexOf(""));     // 0
console.log("".includes(""));         // true
console.log("".indexOf(""));          // 0

includes("")

true

indexOf("")

0

0

2. 性能考量：长字符串与高频操作

对于绝大多数前端应用场景，字符串查找的性能差异通常可以忽略不计。现代JavaScript引擎对这些内置方法都做了高度优化。然而，在以下特定情况下，你可能需要稍微留意：

• 非常长的字符串： 如果你的主字符串有几十万甚至上百万个字符，并且你需要频繁地对其进行子串查找操作，那么不同方法的性能差异可能会显现出来。例如，

  toLowerCase()

  登录后复制
  或

  toUpperCase()

  登录后复制
  会创建新的字符串，这会消耗内存和CPU。
• 循环中的查找： 如果你在一个大型循环中，对大量字符串或同一个长字符串进行重复的子串查找，即使单次操作很快，累积起来的开销也可能变得显著。

在这种极端情况下，通常

indexOf()

includes()

3. 浏览器兼容性（历史遗留问题）

虽然现在已经不是大问题了，但如果你需要支持非常老的浏览器（比如IE11或更早），

String.prototype.includes()

// 在不支持ES6的环境中，这会抛出TypeError
// "abc".includes("b")

在过去，为了兼容性，我们通常会使用

indexOf() !== -1

includes()

includes()

4. Unicode与复杂字符集

JavaScript的字符串方法通常能很好地处理Unicode字符。例如，

"你好世界".includes("世界")

é

e

´

includes()

indexOf()

总的来说，在日常开发中，

includes()

indexOf()

以上就是js怎么判断字符串是否包含子串的详细内容，更多请关注php中文网其它相关文章！