这篇文章主要整理了 JavaScript 中数组(Array)的常用方法和实践技巧。
# 1. 数组基础操作
# 1.1 创建数组
# 添加元素
array.push(value); // 数组末尾添加元素并返回新的长度
array.unshift(value); // 数组首位添加元素并返回新的长度
删除元素
array.pop(); // 删除数组最后一位并返回删除的元素
array.shift(); // 删除数据第一位并返回删除的元素
array.filter(el => el != 'a'); // 删除指定元素 'a'
查找元素
array.slice(0,1); // 获取数组中指定索引的元素,并返回新的数组,0:数组下标,1:选择位数
array.splice(0,1); // 删除数组指定元素,0:数组下标,1:位数
array.splice(0,1,'value'); // 指定数组索引添加元素
array.indexOf('a'); // 获取元素'a'的索引
array.lastIndexOf('a'); // 反向获取元素'a'的索引
array.find(el => el.id == 1); // 查询数组id为1的元素
array.findIndex(el => el.id == 1); // 查询数组id为1的索引
排序
array.sort(); // 数组排序
array.sort((a, b) => b - a); // 倒序排序
array.reverse(); // 数组倒序
高阶函数
array.fill('1'); // 使用'1'填充数组
array.filter((el, index, array) => el >= 10); // 过滤10以下的数字
array.map(el => el.toLowerCase()); // 将数组转换成小写字母
array.some(el => el > 10); // 检查数组是否有大于10的数字,有则返回true
array.every(el => el > 10); // 检查数组是否有小于10的数字,效果与some相反
array.reduce((total, el) => total + el); // 返回数组的总和
array.reduceRight((total, el) => total + el); // 返回数组的总和(从右到左)
array.find(el => el > 10); // 返回数组中第一个大于10的元素
array.findIndex(el => el > 10); // 返回数组中第一个大于10的元素索引
array.includes('a'); // 确定数组是否包含'a',返回boolean
array.includes('a', 0); // 确定数组的第一位是否为'a',返回boolean
array.copyWithin(2, 1, 0); // 复制数组的第一个元素到第三个元素上
判断变量是否为数组
arr instanceof Array;
Array.isArray(arr);
Object.getPrototypeof(arr) === Array.prototype;
Object.prototype.toString.call(arr) === '[object Array]'
其他特殊的
array.concat(data); // 数组拼接
array.join('-'); // 用 - 分割数组,将数组转换成字符串
array.toString(); // 将数组转换成字符串
array.toSource(); // 返回数组的源代码
array.toLocaleString(); // 将数组转换成本地字符
array.valueOf(); // 返回对象的原始值
array2 = [...array1]; //数组复制
array3 = [...array1, ...array2]; //数组拼接
// 遍历数组
array.forEach(function (el, index) {
console.log('第' + index + '个元素是:' + el);
});
数组去重
//1.Set()
const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = [...new Set(arr)];
console.log(uniqueArr); // 输出:[1, 2, 3, 4, 5]
//2.reduce()/forEach() 将数值push到一个新数组
const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = arr.reduce((acc, value) => {
if (!acc.includes(value)) {
acc.push(value);
}
return acc;
}, []);
console.log(uniqueArr); // 输出:[1, 2, 3, 4, 5]
//3.filter()/indexOf()
const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = arr.filter((value, index, self) => self.indexOf(value) === index);
console.log(uniqueArr); // 输出:[1, 2, 3, 4, 5]