includes的匹配单个或者多个的方法

“开启掘金成长之旅！这是我参与「掘金日新计划 · 2 月更文挑战」的第 4天，点击查看活动详情” 我们先来对includes做一个简单的介绍:

includes()  方法用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否则返回 false。

部分示例如下:

[1, 2, 3].includes(2);     // true
[1, 2, 3].includes(4);     // false
[1, 2, 3].includes(3, 3);  // false
[1, 2, 3].includes(3, -1); // true
[1, 2, NaN].includes(NaN); // true

我们在写代码的时候常常要用到字符串匹配,用includes方法可以帮助省掉一堆的遍历循环比较,具体实现方法如下

一、匹配单个字符

<script>
// 要匹配的字符串
let a = 'apple
let b = 'This is my apple'
 // 进行匹配
let c = b.includes(a) 
console.log('c的打印结果为:'+ c)// Expected output: c的打印结果为true
</script>

打印结果如下:

二、匹配单个数组

<script>
    // 要匹配的字符串
    let a = "apple";

    let b = ['banana','apple','pear','strawberry'];

    // 进行匹配
    let c = b.includes(a);

    console.log('c的打印结果为:'+ c) // Expected output: c的打印结果为true
</script>

打印结果如下:

三、匹配多个条件

let pathname = window.location.pathname // 这里是获取当前路由的链接,也就是一个不确定的url路由链接
let condition = ['router1', 'router2', 'router3'] // 这里是你想要匹配的多个条件
if(condition.find(item => pathname.includes(item))) {
// 如果路由链接里匹配了router1,或者router2,再或者router3,匹配他们当中任意一个即可进行接下来的操作
}

PS:这里主要就是find方法的调用实现,具体的原理可以看这里的介绍~[Array.prototype.find()]

以上就是includes的匹配单个或者多个的方法,我的举例只是最简单的一个demo,大家根据自己的需求自行修改即可,具体内容我也是用最通俗易懂的方式来讲解了,有不清楚的,可以评论,大家一起讨论讨论。

最后,祝大家发大财~