【JS】9--数组

数组

知识汇总

前置知识： 数组是一个有序的数据集合，可使用数组名称和索引进行访问。

let arr = [1,2,3];
arr[0] = 1;

在JavaScript中数组没有明确数据类型。

let arr = [1, 'hi', undefined, fun()];

一 . 创建数组

创建数组方法有3种：

let arr = new Array(ele1, ele2, ele3, ..., eleN);
let arr = Array(ele1, ele2, ele3, ..., eleN);
let arr = [ele1, ele2, ele3, ..., eleN];

上面是已知数组元素，另外一种还有创建一个长度不为0，且有没有任何元素的数组：

let len = 5;

let arr = new Array(len); // 方法1
let arr = Array(len);     // 方法2
let arr = [];             // 方法3
arr.length = len;

若传入的数组长度不是整数，则报错：

let arr = new Array(3.5); 
let arr = Array(3.5); 
let arr = [];
arr.length = 3.5;
//Uncaught RangeError: Invalid array length

其中要注意这两种创建方法是不同的：

let arr1 = new Array(4);   // [empty × 4]
let arr2 = [4];            // [4]
for(let k in arr1){
    console.log(k);
}  // undefined
for(let k in arr2){
    console.log(k);
}  // 0

 var 变量名=new Array( ); // 新建一个长度为零的数组

 var 变量名=new Array( n );// 新建一个长度为N的数组

 var 变量名=new Array( 元素1,元素2,元素3,…); // 新建一个指定长度的数组，并赋值

 var 变量名=[ 元素1,元素2,元素3,…];  // 简单方法

=========================================================

二 . 使用数组

1. 简单使用

a. 获取数组指定位置的值：

let a = [1,2,5];
a[0];  // 1
a[2];  // 5
a[3];  // undefined

获取数组长度：length

let a = [1,2,5];
a.length;    // 3
a["length"]; // 3

设置数组指定位置的值：

let a = [1,2,5];
a[0] = 9;
a[2] = 99;
a[3] = 999;

b. 理解数组length

• 数组的索引值是从0开始，即上面数组索引0的是1,索引1的值是2，依次下去。
• 数组length永远返回的是数组最后一个元素的索引加1。
• 可通过arr.length = 0来清空数组。
• 可通过arr.length = len来设置数组长度。

===========================================================

三 . 操作数组

1. 遍历数组

遍历数组就是以某种方法处理数组的每个元素，简单如下：

a. 使用for循环：

let arr = ["pingan", "leo", "robin"];
for (let i = 0; i

b. 使用 for...in：

let arr = ["pingan", "leo", "robin"];
for(let i in arr){
    console.log(`第${i}个元素是：${arr[i]}；`)
}

c. 使用forEach：

arr.forEach(callback) 接收一个回调方法。
callback(val, index, array) : 接收三个参数：

• val : 当前处理的元素；
• index : 当前处理的元素的索引；
• array : 正在处理的数组；

可参考MDN Array.prototype.forEach 的详细介绍。

let arr = ["pingan", "leo", "robin"];
arr.forEach(function(val, i, array){
    console.log(`第${i}个元素是：${val}；`)
})

更多方法：https://www.cnblogs.com/woshidouzia/p/9304603.html

==========================================================

2. 数组排序

从大到小

• sort（） 排序
• reverse（） 翻转
• sort((a,b)=>a>b?-1:1)

a. reverse()

var arr = [8,4,9,1];
console.log(arr.reverse());   //  [1, 9, 4, 8]
console.log(arr);   //  [1, 9, 4, 8]

可以看出，reverse()会直接改变原数组，并且返回值也是倒序后的数组。

b. sort()

记得当年学C语言时，要学各种各样的排序算法，比如经典的冒泡排序法、二分排序法等，现在抛开这些算法不说，JS就自带原生的排序函数，用起来非常方便，它就是sort()。

不传参数

var arr = [8,4,9,1];
console.log(arr.sort());   //  [1, 4, 8, 9]
console.log(arr);   //  [1, 4, 8, 9]

我们再来看下一个例子：

var arr = [8,90,9,16];
console.log(arr.sort());  //  [16, 8, 9, 90]

可以看出，sort()不传参数时会按升序方式对数组项进行排序，并且与reverse()一样既改变原数组，同时返回的也是排序后的数组。

案例2 最终排序返回的不应该是[8, 9, 16, 90] ，返回的是[16, 8, 9, 90]，这是因为，sort()并不是按照数值进行排序，而是按字符串字母的ASCII码值进行比较排序的，所以当数组项为数字时，sort()也会自动先将数字转换成字符串，然后再按字母比较的规则进行排序处理。

现在我们再回头看看前面两个例子。当arr为[8,4,9,1]时，数组每一项转换成字符串后进行排序的结果正好与数字排序结果相同；而当arr为[8,90,9,16]时，数组每一项转换成字符串后就得按顺序一位一位进行比较，比如升序排序时，“16”应该排在最前面，因为“16”的第一位是“1”，比“8”和“9”的ASCII码值都要小。

传入一个函数

这个函数参数功能其实很简单，实际上就是告诉sort()排序方式到底是升序还是降序

var arr = [8,90,9,16];
// 升序
console.log(arr.sort(function (a, b) {
    return a - b;
}));    //  [8, 9, 16, 90]

// 降序
console.log(arr.sort(function (a, b) {
    return b - a;
}));   //  [90, 16, 9, 8]

这种用法的规则是，当sort()传入函数中的第一个参数a位于第二个参数b之前，则返回一个负数，相等则返回0，a位于b之后则返回正数。

比如，当要做升序排序时，我们需要想到前面的数肯定是要比后面的数小，所以传入的这个函数参数返回值应该要是个负数，因此函数参数返回a - b。

注：冒泡排序、快速排序、希尔排序、插入排序
https://www.jianshu.com/p/da9e31c485c2

========================================================

3. 数组去重

方法一：利用ES6的Array.from() 扩展运算符 以及 Set

Set:一个可以是任何类型的独一无二的值的集合.

  function unique(arr){
      return Array.from(new Set(arr));
  }

你也可以这样写:

var arr = [1,2,3,4,2,3,4,8];
  function unique(arr){
      return [...new Set(arr)];
  }
console.log(unique(arr));

方法二：遍历数组，建立新数组，利用indexOf判断是否存在于新数组中，不存在则push到新数组，最后返回新数组

index 差下标不同去重
1. 当前 会有个下标
2. indexOf 查找也会返回一个下标
3. 如果两个下标不同说明是重复的。

indexOf() :方法可返回某个指定的字符串值在字符串中首次出现的位置。如果没有则返回-1

var arr = [1,2,3,4,2,3,4,8];
 function unique(arr){
     var newArr = [];
     for(var i in arr) {
         if(newArr.indexOf(arr[i]) == -1) {
             newArr.push(arr[i])
         }
     }
     return newArr;
 }
console.log(unique(arr));

方法三：利用for嵌套for，然后splice去重（ES5中最常用）

var arr = [1,2,3,4,2,3,4,8];
function unique(arr){            
        for(var i=0; i

方法四：先排序，新数组最后一项为旧数组第一项，每次插入判断新数组最后一项是否与插入项相等

function unique(arr) {
    var newArr = [];
    var end; //end其实就是一道卡
    arr.sort();
    end = arr[0];
    newArr.push(arr[0]);
    for (var i = 1; i < arr.length; i++) {
        if (arr[i] != end) {
            newArr.push(arr[i]);
            end = arr[i]; //更新end
        }
    }
    return newArr;
}

filter去重

var arr = [1, 2, 2, 3, 4, 5, 5, 6, 7, 7];
var arr2 = arr.filter(function(x, index,self) { 
return self.indexOf(x)===index;
}); 
console.log(arr2); //[1, 2, 3, 4, 5, 6 ,7]

更多方法：https://segmentfault.com/a/1190000016418021?utm_source=tag-newest

=========================================================

4. 数组与字符串转换

数组转字符串 a.join
字符串转数组s.split

=====================================================

5. 数组合并，拷贝 ，深拷贝 有哪些方法

slice和concat方法浅拷贝和深拷贝
array_merge()合并两个数组
concat将a数组合并到b数组中去
遍历，递归实现深拷贝
转json字符串，字符串转json 实现深拷贝
JSON.stringify(obj) JSON.parse(str)

=============================================================

四. 数组方法（增删改查）

方法名称	方法介绍
增	------------------------------------------------------------
unshift()	向数组的开头添加一个或更多元素，并返回新的长度。
push()	向数组的末尾添加一个或更多元素，并返回新的长度。
splice(from,length,add)	删除元素，并向数组添加新元素。
删	-----------------------------------------------------------
pop()	删除并返回数组的最后一个元素
shift()	删除并返回数组的第一个元素
splice(from,len,add)	删除元素，并向数组添加新元素。
改	----------------------------------------------------------
concat()	连接两个或更多的数组，并返回结果。
join()	把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。
reverse()	颠倒数组中元素的顺序。
sort()	对数组的元素进行排序
toString()	把数组转换为字符串，并返回结果。
toSource()	返回该对象的源代码。
toLocaleString()	把数组转换为本地数组，并返回结果。
valueOf()	返回数组对象的原始值
查	-------------------------------------------------------------
indexOf()	在数组中搜索指定元素并返回第一个匹配的 索引
lastIndexOf()	在数组中搜索指定元素并返回最后一个匹配的 索引
slice(start,end)	从某个已有的数组返回选定的 元素 ,索引start到end，包start不包end
includes（）	找到返回true
find()	find()方法用于找出第一个符合条件的数组成员value，参数为一个回调函数，所有成员依次执行该回调函数，返回第一个返回值为true的成员，如果没有一个符合则返回undefined。
findIndex() es6	findIndex()方法与find()类似，返回第一个符合条件的数组成员的位置，如果都不符合则返回-1

可参考W3school JavaScript Array 对象 的详细介绍。

1. concat()

连接两个或更多的数组，并返回一个新数组。

• 语法:
  arr.concat(a1, a2, ..., an);
• 参数:
  arr：目标数组；
  a1,a2,...,an：需要合并的元素；

let a1 = [1,2,3];
let a2 = [9,99,999];
let a = a1.concat(a2);
// [1, 2, 3, 9, 99, 999]

2. join()

使用指定分隔符，连接两个或多个数组的元素，返回一个字符串。

• 语法:
  arr.join(sep);
• 参数:
  arr：目标数组；
  sep：连接的分隔符，默认值为“,”；

let arr = ["pingan", "leo", "robin"];
arr.join();    // "pingan,leo,robin"
arr.join("");  // "pinganleorobin"
arr.join(","); // "pingan,leo,robin"

3. pop()和push()

• pop(): 删除并返回数组最后一个元素，改变原数组。

• push(item): 向数组末尾添加一个或多个元素，改变原数组，返回新的数组长度。
  方便记忆和理解：两个都是从数组末尾操作，pop()是删除最后一个元素，push()是向最后一位添加新的元素。

let arr = ["pingan", "leo"];
let a1 = arr.pop();              // "leo"
let a2 = arr.push("robin","hi"); // 3
arr;   // ["pingan", "robin", "hi"]

4. shift()和unshift()

• shift(): 删除并返回数组第一个元素，改变原数组。
• unshift(item): 向数组头部添加一个或多个元素，改变原数组，返回新的数组长度。

方便记忆和理解：两个都是从数组头部操作，shift()是删除第一个元素，unshift()是向第一位添加新的元素。

let arr = ["pingan", "leo"];
let a1 = arr.shift();               // "pingan"
let a2 = arr.unshift("robin","hi"); // 3
arr;   // ["robin", "hi", "leo"]

5. reverse()

颠倒数组中元素的顺序，改变原数组。

let arr = [1, 2, 3, 4];
arr.reverse();  // [4, 3, 2, 1]

6. slice()

用于提取数组中一个片段，作为新数组返回。
slice(start[,end]): 接收2个参数：

• start: 必需，指定起始索引，若负数则从数组最后开始算起，-1为倒数第一位，-2为倒数第二位，以此类推。
• end： 可选，指定结束索引，若没传则表示到数组结束。

注意：
end若有指定的话，是不包含end索引上的值。

let arr = [1, 2, 3, 5, 6];
let a1 = arr.slice(2);    // [3, 5, 6]
let a2 = arr.slice(2,3);  // [3]

7. splice()

从数组中删除指定索引开始的项目，然后返回被删除的项目。

• 语法： arr.splice(index, num, a1, a2,...,an);
• 参数：
  index: 必需，起始位置的索引，若负数则从数组最后开始算起；
  num：必需，删除的数量，若为0则不删除；
  a1,a2,...an：可选，为数组添加的元素；

let arr = [1, 2, 3, 4];
let a = arr.splice(1, 2, "hi", "leo");
// a =>  [2, 3]
// arr =>  [1, "hi", "leo", 4]

8. sort()

对数组的元素进行排序，改变原数组。
可接受一个回调方法作为比较函数，来决定排序方式。
比较函数应该具有两个参数 a 和 b，返回值如下：
若 a 小于 b，在排序后的数组中 a 应该出现在 b 之前，则返回一个小于 0 的值。 若 a 等于 b，则返回 0。 若 a 大于 b，则返回一个大于 0 的值。

let a1 = [1,3,6,9,10];
a1.sort(); // [1, 10, 3, 6, 9]
a1.sort(function(a,b){
    return a > b ? 1 : a < b ? -1 : 0;
})         // [1, 3, 6, 9, 10]

9. indexOf()和lastIndexOf()

两者都是在数组搜索指定元素，只是indexOf()返回的是搜索到的第一个元素的索引，而lastIndexOf()返回的是搜索到的最后一个元素的索引。
语法：
indexOf(ele[,start])和lastIndexOf(ele[,start]);
参数：

• ele: 需要搜索的元素。
• start: 开始搜索的索引。

let arr = ["hh1", "hh2", "hh2", "hh2", "hh3", "hh4"];
let a1 = arr.indexOf("hh2");      // 1
let a2 = arr.lastIndexOf("hh2");  // 3
let a3 = arr.indexOf("hh2",2);    // 2

10. find()和findIndex()

find()方法用于找出第一个符合条件的数组成员，参数为一个回调函数，所有成员依次执行该回调函数，返回第一个返回值为true的成员，如果没有一个符合则返回undefined。

[1,2,3,4,5].find( a => a < 3 ); // 1
回调函数接收三个参数，当前值、当前位置和原数组。

[1,2,3,4,5].find((value, index, arr) => {
    // ...
});

findIndex()方法与find()类似，返回第一个符合条件的数组成员的位置，如果都不符合则返回-1。

[1,2,3,4].findIndex((v,i,a)=>{
    return v>2;
}); // 2

---

五 . 数组高阶方法（迭代）

• ES6
  flat（）
  flatMap（）
  find（）
  findIndex（）
  fill（）
  includes（）

方法名称	方法介绍
forEach()	为数组中的每个元素执行一次回调函数。
every()	如果数组中的每个元素都满足测试函数，则返回 true，否则返回 false。
some()	如果数组中至少有一个元素满足测试函数，则返回 true，否则返回 false。
filter()	将所有在过滤函数中返回 true 的数组元素放进一个新数组中并返回。
map()	返回一个由回调函数的返回值组成的新数组。
reduce()	从左到右为每个数组元素执行一次回调函数，并把上次回调函数的返回值放在一个暂存器中传给下次回调函数，并返回最后一次回调函数的返回值。
reduceRight()	从右到左为每个数组元素执行一次回调函数，并把上次回调函数的返回值放在一个暂存器中传给下次回调函数，并返回最后一次回调函数的返回值。

以下是ES6规范新增的数组方法：

方法名称	方法介绍
keys()	返回一个数组迭代器对象，该迭代器会包含所有数组元素的键。
values()	返回一个数组迭代器对象，该迭代器会包含所有数组元素的值。
entries()	返回一个数组迭代器对象，该迭代器会包含所有数组元素的键值对。
find()	找到第一个满足测试函数的元素并返回那个元素的值，如果找不到，则返回 undefined。
findIndex()	找到第一个满足测试函数的元素并返回那个元素的索引，如果找不到，则返回 -1。

可参考MDN Array 的详细介绍。

1. forEach()

对数组的每个元素执行一次提供的函数。

语法：
arr.forEach(callback)。

参数：
callback(val, index, arr) : 需要执行的函数，接收三个参数：

• val : 正在处理的当前元素;
• index : 可选，正在处理的当前元素的索引;
• arr : 可选，正在操作的数组;

let a = [1,3,5,7];
a.forEach(function(val, index, arr){
    arr[index] = val * 2
})
a ; // [2, 6, 10, 14]

2. every()

测试数组的所有元素是否都通过了指定函数的测试。
语法：
arr.every(callback)。

参数：
callback(val, index, arr) : 需要执行的函数，接收三个参数：

• val : 正在处理的当前元素;
• index : 可选，正在处理的当前元素的索引;
• arr : 可选，正在操作的数组;

返回值：
若都通过返回true，否则返回false。

let a = [1, "", "aa", 13, 6];
let res = a.every(function(val, index, arr){
    return typeof val == "number";
})
res;// false

let b = [1, 2, 3];
let r = b.every(function(val, index, arr){
    return typeof val == "number";
})
r;  // true

3. some()

测试数组中的某些元素是否通过由提供的函数实现的测试。
语法：
arr.some(callback)。

参数：
callback(val, index, arr) : 需要执行的函数，接收三个参数：

• val : 正在处理的当前元素;
• index : 可选，正在处理的当前元素的索引;
• arr : 可选，正在操作的数组;

返回值：
若有一个通过返回true，否则返回false。

let a = [1, "", "aa", 13, 6];
let res = a.some(function(val, index, arr){
    return typeof val == "number";
})
res;// true

let b = [1, 2, 3];
let r = b.some(function(val, index, arr){
    return typeof val == "number";
})
r;  // true

4. filter()

将所有在过滤函数中返回 true 的数组元素放进一个新数组中并返回。

语法：
arr.filter(callback)。

参数：
callback(val, index, arr) : 需要执行的函数，接收三个参数：

• val : 正在处理的当前元素;
• index : 可选，正在处理的当前元素的索引;
• arr : 可选，正在操作的数组;

返回值：
一个返回通过测试的元素的数组，若都没有则返回空数组。

let a = [1, "", "aa", 13, 6];
let res = a.filter(function(val, index, arr){
    return typeof val == "number";
})
res;//[1, 13, 6]

5. map()

传入一个操作函数，对每个元素执行此方法，并返回一个执行后的数组。

语法：
arr.map(callback)。

参数：
callback(val, index, arr) : 需要执行的函数，接收三个参数：

• val : 正在处理的当前元素;
• index : 可选，正在处理的当前元素的索引;
• arr : 可选，正在操作的数组;

返回值：
一个新数组，每个元素都是回调函数的结果。

let a = [1, 3, 5];
let b = a.map(function(val, index, arr){
    return val + 2;
})
b; //[3, 5, 7]

==========================================================

六 . 数组的拓展（ES6）

1. 拓展运算符

拓展运算符使用(...)，类似rest参数的逆运算，将数组转为用(,)分隔的参数序列。

console.log(...[1, 2, 3]);   // 1 2 3 
console.log(1, ...[2,3], 4); // 1 2 3 4

拓展运算符主要使用在函数调用。

function f (a, b){
    console.log(a, b);
}
f(...[1, 2]); // 1 2

function g (a, b, c, d, e){
    console.log(a, b, c, d, e);
}
g(0, ...[1, 2], 3, ...[4]); // 0 1 2 3 4

若拓展运算符后面是个空数组，则不产生效果。

[...[], 1]; // [1]

替代apply方法

// ES6之前
function f(a, b, c){...};
var a = [1, 2, 3];
f.apply(null, a);

// ES6之后
function f(a, b, c){...};
let a = [1, 2, 3];
f(...a);

// ES6之前
Math.max.apply(null, [3,2,6]);

// ES6之后
Math.max(...[3,2,6]);

拓展运算符的运用

• (1)复制数组：
  通常我们直接复制数组时，只是浅拷贝，如果要实现深拷贝，可以使用拓展运算符。

// 通常情况 浅拷贝
let a1 = [1, 2];
let a2 = a1; 
a2[0] = 3;
console.log(a1,a2); // [3,2] [3,2]

// 拓展运算符 深拷贝
let a1 = [1, 2];
let a2 = [...a1];
// let [...a2] = a1; // 作用相同
a2[0] = 3;
console.log(a1,a2); // [1,2] [3,2]

• (2)合并数组：
  注意，这里合并数组，只是浅拷贝。

let a1 = [1,2];
let a2 = [3];
let a3 = [4,5];

// ES5 
let a4 = a1.concat(a2, a3);

// ES6
let a5 = [...a1, ...a2, ...a3];

a4[0] === a1[0]; // true
a5[0] === a1[0]; // true

• (3)与解构赋值结合：
  与解构赋值结合生成数组，但是使用拓展运算符需要放到参数最后一个，否则报错。

let [a, ...b] = [1, 2, 3, 4]; 
// a => 1  b => [2,3,4]

let [a, ...b] = [];
// a => undefined b => []

let [a, ...b] = ["abc"];
// a => "abc"  b => []

2. Array.from()

将 类数组对象 和 可遍历的对象，转换成真正的数组。

// 类数组对象
let a = {
    '0':'a',
    '1':'b',
    length:2
}
let arr = Array.from(a);

// 可遍历的对象
let a = Array.from([1,2,3]);
let b = Array.from({length: 3});
let c = Array.from([1,2,3]).map(x => x * x);
let d = Array.from([1,2,3].map(x => x * x));

3. Array.of()

将一组数值，转换成数组，弥补Array方法参数不同导致的差异。

Array.of(1,2,3);    // [1,2,3]
Array.of(1).length; // 1

Array();       // []
Array(2);      // [,] 1个参数时，为指定数组长度
Array(1,2,3);  // [1,2,3] 多于2个参数，组成新数组

4. find()和findIndex()

find()方法用于找出第一个符合条件的数组成员，参数为一个回调函数，所有成员依次执行该回调函数，返回第一个返回值为true的成员，如果没有一个符合则返回undefined。

[1,2,3,4,5].find( a => a < 3 ); // 1

回调函数接收三个参数，当前值、当前位置和原数组。

[1,2,3,4,5].find((value, index, arr) => {
    // ...
});

findIndex()方法与find()类似，返回第一个符合条件的数组成员的位置，如果都不符合则返回-1。

[1,2,3,4].findIndex((v,i,a)=>{
    return v>2;
}); // 2

5. fill()

用于用指定值填充一个数组，通常用来初始化空数组，并抹去数组中已有的元素。

new Array(3).fill('a');   // ['a','a','a']
[1,2,3].fill('a');        // ['a','a','a']

并且fill()的第二个和第三个参数指定填充的起始位置和结束位置。

[1,2,3].fill('a',1,2);//  [1, "a", 3]

6. entries(),keys(),values()

主要用于遍历数组，entries()对键值对遍历，keys()对键名遍历，values()对键值遍历。

for (let i of ['a', 'b'].keys()){
    console.log(i)
}
// 0
// 1

for (let e of ['a', 'b'].values()){
    console.log(e)
}
// 'a'
// 'b'

for (let e of ['a', 'b'].entries()){
    console.log(e)
}
// 0 'a'
// 1 'b'

7. includes()

用于表示数组是否包含给定的值，与字符串的includes方法类似。

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

第二个参数为起始位置，默认为0，如果负数，则表示倒数的位置，如果大于数组长度，则重置为0开始。

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

8. flat(),flatMap()

flat()用于将数组一维化，返回一个新数组，不影响原数组。
默认一次只一维化一层数组，若需多层，则传入一个整数参数指定层数。
若要一维化所有层的数组，则传入Infinity作为参数。

[1, 2, [2,3]].flat();        // [1,2,2,3]
[1,2,[3,[4,[5,6]]]].flat(3); // [1,2,3,4,5,6]
[1,2,[3,[4,[5,6]]]].flat('Infinity'); // [1,2,3,4,5,6]

flatMap()是将原数组每个对象先执行一个函数，在对返回值组成的数组执行flat()方法，返回一个新数组，不改变原数组。
flatMap()只能展开一层。

[2, 3, 4].flatMap((x) => [x, x * 2]); 
// [2, 4, 3, 6, 4, 8] 

七 . 数组的拓展（ES7）

Array.prototype.includes()方法

includes()用于查找一个值是否在数组中，如果在返回true，否则返回false。

['a', 'b', 'c'].includes('a');     // true
['a', 'b', 'c'].includes('d');     // false

includes()方法接收两个参数，搜索的内容和开始搜索的索引，默认值为0，若搜索值在数组中则返回true否则返回false。

['a', 'b', 'c', 'd'].includes('b');      // true
['a', 'b', 'c', 'd'].includes('b', 1);   // true
['a', 'b', 'c', 'd'].includes('b', 2);   // false

与indexOf方法对比，下面方法效果相同：

['a', 'b', 'c', 'd'].indexOf('b') > -1;  // true
['a', 'b', 'c', 'd'].includes('b');      // true 

includes()与indexOf对比：

• includes相比indexOf更具语义化，includes返回的是是否存在的具体结果，值为布尔值，而indexOf返回的是搜索值的下标。
• includes相比indexOf更准确，includes认为两个NaN相等，而indexOf不会。

let a = [1, NaN, 3];
a.indexOf(NaN);     // -1
a.includes(NaN);    // true

另外在判断+0与-0时，includes和indexOf的返回相同。

[1, +0, 3, 4].includes(-0);   // true
[1, +0, 3, 4].indexOf(-0);    // 1

[参考资料]

1.MDN 索引集合类
2.MDN 数组对象
3.W3school JavaScript Array 对象