數組Array和字符串String的indexOf方法，以及ES7(ES2016)中新增的Array.prototype.includes方法

前言

我們在判斷某一個字符是否存在於一個字符串中或者某一個值是否存在於一個數組中時，ES7之前我們需要使用indexOf，ES7引入了新的方法includes

語法

數組：Array.inexOf(searchElement, startIndex)

字符串：String.inexOf(searchElement, startIndex)

第一個參數searchElement是要檢索的值

第二個參數是可選值，從何處開始進行檢索，如果不規定此值，則默認從首字符開始檢索

查看數組和字符串的原型鏈我們就可以看到有indexOf這個方法

let str = 'react,vue';
let arr = ['react', 'vue'];
console.log(str.__proto__);
console.log(arr.__proto__);

我們可以看到數組和字符串的原型鏈中就有這個方法，並且我們看到有一個includes方法，它就是es7中新增的屬性

用法

indexOf：（返回檢索元素在被檢索對象中首次出現的位置， 如果沒有找到則返回-1， 我們判斷檢索元素是否存在，則需要判斷這個值是不是等於-1）

// 數組
let arr = ['react', 'vue', 'javascript'];
if (arr.indexOf('vue') !== -1) {
    console.log(arr.indexOf('vue')); // 1
}

// 字符串
let str = 'react, vue, javascript';
if (str.indexOf('vue') !== -1) {
    console.log(str.indexOf('vue')); // 6
}

includes：（如果檢索元素存在於被檢索對象中則返回true，否則返回false）

// 數組
let arr = ['react', 'vue', 'javascript'];
if (arr.includes('vue')) {
    console.log('arr數組中有vue這個值');
}

// 字符串
let str = 'react, vue, javascript';
if (str.includes('vue')) {
    console.log('str中有vue');
}

總結

使用includes就再也不用判斷是不是-1了，如果要獲取索引位置還是使用indexOf，非常好用的方法