includes与indexOf

includes和indexOf都是用来检测数组或者字符串中是否包含某元素的方法，includes是ES6的。

indexOf

indexOf 这个方法对大小写敏感，不能是indexof；
入参有两个：要查找的元素、开始查找的下标(可以不传)；
查找的元素存在，返回第一个满足条件的索引，后面的就不会管了；
查找的元素不存在，返回 -1;
特殊点：对数组中查询 NaN 是无效的；

let arr = ['as', 'ab', 'test','ab'];
let arrRes = arr.indexOf('ab', 0);     // 从下标0开始查找，是否含有'as',有则返回找到第一个匹配元素的索引
let arrRes1 = arr.indexOf('lala', 0);  // 从下标0开始查找，是否含有'lala'，没有返回 -1
console.log(arrRes, arrRes1);          // 1  -1

let str = 'abcdefghi';
let strRes = str.indexOf('b', 0);     // 从下标0开始查找，是否含有'b',有则返回找到第一个匹配元素的索引
let strRes1 = str.indexOf('a', 3);    // 从下标3开始查找，是否含有'a'，没有返回 -1
console.log(strRes, strRes1);         // 1  -1

let special = [undefined, null, NaN, 'NaN'];
console.log(special.indexOf(undefined));    // 0
console.log(special.indexOf(null));         // 1
console.log(special.indexOf(NaN));          // -1 查不到
console.log(special.indexOf(`NaN`));        // 3

includes

入参、用法方面和indexOf是一样的；
查找的元素存在，返回 true;
查找的元素不存在，返回 false;
解决了indexOf查NaN无效的问题；

let arr = ['as', 'ab', 'test', 'ab'];
let arrRes = arr.includes('ab', 0);
let arrRes1 = arr.includes('lala', 0);
console.log(arrRes, arrRes1); // true false

let str = 'abcdefghi';
let strRes = str.includes('b');
let strRes1 = str.includes('a', 3);
console.log(strRes, strRes1); // true false

let special = [undefined, null, NaN];
console.log(special.includes(undefined)); // true
console.log(special.includes(null));      // true
console.log(special.includes(NaN));       // true

性能测试

为了让程序执行时间数据更容易区分，准备了一个长度1000000位的数组，分别使用indexOf和includes去查询，看看他们各自使用的时间：

// 生成随机字符串
function randomString(len) {
    len = len || 32;
    let $chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678'; /****默认去掉了容易混淆的字符oOLl,9gq,Vv,Uu,I1****/
    let maxPos = $chars.length;
    let res = '';
    for (i = 0; i < len; i++) {
        res += $chars.charAt(Math.floor(Math.random() * maxPos));
    }
    return res;
}

// 组装一个长度1000000位的数组
let arr = new Array();

for (let i = 0; i < 1000000; i++) {
    arr.push(randomString(4));
}
arr.push('test');

console.time('indexOf耗时');
console.log('索引：', arr.indexOf('test'));
console.timeEnd('indexOf耗时');

console.time('includes耗时');
console.log('是否存在：', arr.includes('test'));
console.timeEnd('includes耗时');

为了提高数据的准确性，运行了很多次，打印结果罗列在下方，根据数据可以明显的看出includes性能优于indexOf：

索引： 1000000
indexOf耗时: 13.363ms
是否存在： true
includes耗时: 8.925ms

索引： 1000000
indexOf耗时: 13.729ms
是否存在： true
includes耗时: 14.973ms

索引： 1000000
indexOf耗时: 12.111ms
是否存在： true
includes耗时: 9.591ms

索引： 1000000
indexOf耗时: 13.745ms
是否存在： true
includes耗时: 10.403ms

索引： 1000000
indexOf耗时: 11.771ms
是否存在： true
includes耗时: 8.912ms