数组这一数据结构在JavaScript中被运用得很多，它通常被用来存储各种各样的数据。JS数组上提供了许多的方法来方便开发者对数组进行增删改查等操作。
增删改查
在数组中增加元素
在数组中可以通过push，unshift，splice，concat这些方法来增加元素。
- push
const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.push('A');
console.log(arr);// 输出 [1, 2, 3, 4, 5, 6, 7, 8, 'A']
push方法可以向数组的末尾添加一个或多个元素。
- unshift
const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.unshift('B');
console.log(arr); // 输出 ['B', 1, 2, 3, 4, 5, 6, 7, 8]
unshift方法可以向数组的开头添加一个或多个元素。
- splice
const arr = [1, 2, 3, 4, 5, 6, 7, 8]
arr.splice(3, 0, 'C')//向arr数组的索引3处插入元素M
console.log(arr); //输出：[1, 2, 3, 'C', 4,5, 6, 7, 8]
splice方法的第一个参数代表元素要插入的数组的下标，第二个参数代表数组要删除的元素数量，从第二个参数之后的参数代表要插入到数组中的元素。
- concat
const arr = [1, 2, 3, 4, 5, 6, 7, 8]
const arr2 = ['A', 'B', 'C']
const arr3 = arr.concat(arr2) //arr3的值是数组arr和arr2拼接后的元素的组合
console.log(arr3);//输出：[1, 2, 3, 4, 5, 6, 7, 8, 'A', 'B', 'C']
concat方法用于合并两个或多个数组，并且会返回一个新的数组。
在数组中删除元素
在数组中可以通过pop shift splice slice这些方法来删除元素。
- pop
const arr = [1, 2, 3, 4, 5, 6, 7, 8]
const A=arr.pop()
console.log(A);//输出8
console.log(arr);//输出[1, 2, 3, 4, 5, 6, 7]
pop方法会删除数组中的最后一个元素，并且返回这个被删除的元素。
- shift
const arr = [1, 2, 3, 4, 5, 6, 7, 8];
const B = arr.shift();
console.log(B); //输出1
console.log(arr); //输出[2, 3, 4, 5, 6, 7, 8]
shift方法会删除数组中的第一个元素，并且返回这个被删除的元素。
- splice
const arr = [1, 2, 3, 4, 5, 6, 7, 8]
// const arr2 = [1, 2, 3]
const arr2 = arr.splice(0, 2)//从数组arr的下标0开始切割两个元素
console.log(arr);//输出[ 3, 4, 5, 6, 7, 8 ]
console.log(arr2);//输出[ 1, 2 ]
- slice
const arr = [1, 2, 3, 4, 5, 6, 7, 8]
const arr2 = arr.slice(0, 2)
console.log(arr);//输出[1, 2, 3, 4, 5, 6, 7, 8]
console.log(arr2);//输出[ 1, 2 ]
slice和splice的区别在于，使用splice进行切割会改变原数组，而slice则不会。
对数组中的元素进行修改
在数组中可以通过reverse sort这些方法来对数组中的元素进行修改。
- reverse
const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.reverse(); console.log(arr);
// 输出 [8, 7, 6, 5, 4, 3, 2, 1]
reverse方法用于颠倒数组中元素的顺序,需要注意的是这个方法会修改原数组。
- sort
const arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.sort((a, b) => b - a);// 对数组进行降序排序
console.log(arr);// 输出 [8, 7, 6, 5, 4, 3, 2, 1]
sort方法用于对数组中的元素进行排序，需要注意的是这个方法会修改原数组。
对数组中的元素进行查询
在数组中可以通过indexOf includes lastIndexOf find这些方法来对数组中的元素进行查询。
- indexOf
const arr = [1, 2, 3, 4, 5, 6, 7, 8,'A']
const index1 = arr.indexOf('A');//查找元素A
const index2 = arr.indexOf('B');//查找元素B
const index3 = arr.indexOf(1); //查找元素1
console.log(index1); //查找成功，输出元素A的下标8
console.log(index2);//查找失败，输出-1
console.log(index3); //查找成功，输出1的下标0
indexOf会在数组中查找指定元素的索引，并返回第一个匹配的元素索引，如果未找到该元素的话则会返回-1。
- includes
const arr = [1, 2, 3, 4, 5, 6, 7, 8,'A']
const includes1 = arr.includes('A');//查找元素A
const includes2 = arr.includes('B');//查找元素B
const includes3 = arr.includes(1);//查找元素1
console.log(includes1); //查找成功 数组中包含元素A 输出 true
console.log(includes2); //查找失败 数组中包含元素B 输出 false
console.log(includes3); //查找成功 数组中包含元素1 输出 true
使用includes方法在数组中查找元素，如果数组中包含该元素则会返回 true，否则返回 false。
- lastIndexOf
const arr = ['A',1, 2, 3, 4, 5, 6, 7, 8,'A']
const lastIndex1 = arr.lastIndexOf('A');//查找元素A
const lastIndex2 = arr.lastIndexOf('B');//查找元素B
const lastIndex3 = arr.lastIndexOf(1);//查找元素1
console.log(lastIndex1); //查找成功 输出最后的A的下标9
console.log(lastIndex2); //查找失败 输出 -1
console.log(lastIndex3); //查找成功 输出最后的1的下标1
lastIndexOf会从后往前在数组中查找指定元素的索引，并返回最后一个匹配的元素索引，如果没有找到则会返回 -1。
- find
const arr = [1, 2, 3, 4, 5, 6, 7, 8,'A']
const arr2 = arr.find((item, index, arr) => {
return item > 5
})
console.log(arr2);//输出6
find会在数组中查找满足指定条件的第一个元素，并返回该元素。否则返回undefined。
转换和迭代
数组的转换
使用join方法可以实现数组的转换。
- join
const arr = [1, 2, 3, 4, 5, 6, 7, 8,'A']
const str = arr.join(', ');//用“,”分隔
console.log(str); // 输出 1, 2, 3, 4, 5, 6, 7, 8, A
join方法会将数组中所有元素转化为字符串并连接起来，返回一个由连接的元素而组成的字符串。
数组的迭代
在数组中可以使用forEach map filter some every这些方法来实现数组的迭代，当然除了以上方法还可以使用最经典的for循环来实现对数组的迭代。
- forEach
const arr = [1, 2, 3, 4, 5, 6, 7, 8,'A']
arr.forEach(item => {
console.log(item);
});
- map
const arr = [1, 2, 3, 4, 5, 6, 7, 8,'A']
const arr2 = arr.map(item => {
return item+1;
});
console.log(arr2); // 输出[2,3,4,5,6,7,8,9,'A1']
值得注意的是，map方法会返回执行后的结果组成的新数组。
- filter
const arr = [1, 2, 3, 4, 5, 6, 7, 8,'A']
const arr2 = arr.filter(element => {
return element % 2 === 0; // 筛选出偶数元素
});
console.log(arr2); // 输出[ 2, 4, 6, 8 ]
filter方法会筛选出数组中满足条件的元素，并返回一个由这些元素组成的新数组。
- some
const arr = [1, 2, 3, 4, 5, 6, 7, 8,'A']
const Some = arr.some(element => {
return element % 2 === 0; // 检查数组中是否存在偶数元素
});
console.log(Some); // 输出 true
some方法会数组中是否存在元素满足指定条件，如果存在满足条件的元素，返回 true，否则返回 false。
- every
const arr = [1, 2, 3, 4, 5, 6, 7, 8,'A']
const Every = arr.every(element => {
return element % 2 === 0; // 检查数组中所有元素是否都为偶数
});
console.log(Every); // 输出 false
every和some不同的是，every需要数组中的所有元素都满足指定的条件才会返回true。
总结
在JavaScript中，数组上有许多的方法来供开发者进行增删改查等操作，掌握这些方法可以帮助我们的开发，同时也是我们应对面试的基础知识。
