ES6+ includes()
字符串查找一直都是程序中的常用操作,在 ES5 中查找字符串是否包含另字符串,一般有两种思维。一是使用正则的方式来匹配,二是使用 ES5 的方式,如 indexOf、lastIdexOf、search。使用正则比较简单,但是需要对正则语法有一定的了解。一般使用 indexOf()
来进行字符串的查找 ,它会返回后第一次出现的指定值的索引,如果未找到该值,则返回 -1。
ES6 新增 includes()
,来替代 indexOf()
弥补它的不足。而 ES6 提供了新的 includes()
可以更好地进行判断,而不需要根据返回的索引进行判断。
includes()
主要用于字符串,判断字符串是否包含另外字符串,其返回值是如果包含该字符串则返回 true 否则返回 false。
使用语法:
str.includes(searchString[, position])
参数说明:
实例:
var str = 'hello world';
console.log(str.includes('hello')); // true
console.log(str.includes('hello', )); // false
在没有传入确切的字符串时,searchString
会被强制设置成 “undefined”,然后在当前字符串中查找这个值。
'undefined'.includes(''); // 返回 true
'undefined'.includes(); // 返回 true
'undefine'.includes(); // 返回 false
'imooc ES6 wiki'.includes(); // 返回 false
上面的最容易在面试中出现,考察你对 includes()
的理解程度。第 1 行返回 true
很容易理解,空字符串嘛这个没问题,但第 2 行返回的结果也是 true
,这说明的字符串在 “undefined” 字符串中,还不能说被设置成了字符串 “undefined” 。
第 3 、 4 行中也没有传值,但返回的结果为 false
,从而证明了在没有传值时,第参数的值被设置成字符串 “undefined”。
在没传值时和 indexOf()
的结果是一致的。下面我们看 indexOf()
在没有参数时是什么样的结果。
'undefined'.indexOf(); // 返回 0
'undefine'.indexOf(); // 返回 -1
上面的中,第 1 行返回的结果是 0,是结果的位置,第 2 行返回的是 -1,说明没有到。虽然返回的结果不一样,但是意义是一样的。includes()
可以替换 indexOf()
使用,includes()
好处在于它可以直接判断,而 indexOf()
还需要对结果进行对比,如下实例:
const str = 'imooc ES6 wiki';
if (str.includes('ES6')) {
// todo
if (str.indexOf('ES6') !== -) {
// todo
}
上面中的两个 if 判断是意思,但是使用 includes()
很简洁,这也是 ES6 设计的初衷。
includes()
的引入是为了代替 indexOf()
作为字符串的的使用。
includes()
是区分大小写的。
'imooc es6'.includes('imooc'); // true
'imooc es6'.includes('Imooc'); // false
includes()
在只有参数时,会从字符串的第字符开始查找。
var str = "I love imooc.";
console.log(str.includes("I love")); // true
console.log(str.includes("imooc")); // true
console.log(str.includes("eimooc")); // false
当 includes()
有第二个参数的时候,会从第二个参数作为索引的位置开始。
var str = "I love imooc.";
console.log(str.includes("love", )); // false
console.log(str.includes("ove", )); // true
第二个参数的意思是,查找字符串开始的位置,例子中的 3 就是查找的位置,所以查找的目标字符串是 ove imooc.
。
当第二个参数是负数时,只要查找的字符串在目标字符串里,无论是多少,都会返回 true。
var str = "I love imooc.";
console.log(str.includes("love", -)); // true
console.log(str.includes("ove", -)); // true
console.log(str.includes("Love", -)); // false
在使用 includes()
时需要注意类型转换的一些问题:
let numStr = '2020';
numStr.includes('2'); // true
numStr.includes(); // true
个例子中 numStr
是字符串, 2
和数字 2
都是能返回正确的结果,这里 includes()
会把数字转换成字符串 ‘2’ 然后再执行操作。
let numStr = ;
numStr.includes(); // Uncaught TypeError: numStr.includes is not a function
从这个例子可以看出,includes
是字符串上的,而这里直接使用在上所以会报语法。如果要使用 includes
来,就必须把数字转化成字符串,然后进行。
let numStr = ;
("" + numStr).includes() // true
这里对 numStr
前加空字符串可以进行类型转换。
本节讲解了字符串的 includes()
的使用,总结以下几点: