数组常用的方法
// 数组常用的方法
let arr = [1, 2, 3, 5, 4, 6, 7, 8, 9];
// arr.length 获取数组的长度
// arr.length-1 获取数组的最后一项
// arr[10] 获取数组为索引为10的值 如果没有就是 undefined
// 数组学习方法
// 方法的作用和含义
// 方法的实参(类型和含义)
// 方法的返回值
// 原来的数组是否会发生改变
// 1,实现数组增删改查的方法
// 这些方法都会修改原数组
//*** arr.push([@value]) 想数组末尾增加内容
// @value 多个任意类型
//@return 新增后数组的长度
arr[arr.length] = 20; //原生的js方法向数组末尾添加数字
console.log(arr.push('name'), arr);//=>index.html:31 11 (11) [1, 2, 3, 5, 4, 6, 7, 8, 9, 20, "name"]
//*** arr.unshift([@value])向数组第一位添加一个数组
// @value:多个任意数组
// @return 返回修改后的数组长度
console.log(arr.unshift(10), arr);//=>12 (12) [10, 1, 2, 3, 5, 4, 6, 7, 8, 9, 20, "name"]
// ***arr.shift() 删除数组中第一个值
// @return 返回修改后的数组长度
console.log(arr.shift(), arr);//=>10 (11) [1, 2, 3, 5, 4, 6, 7, 8, 9, 20, "name"]
// ***arr.pop():删除数组中的最后一项
//@return 返回删除的值
console.log(arr.pop(), arr);//=>name (10) [1, 2, 3, 5, 4, 6, 7, 8, 9, 20]
// ***arr.splice([@value]) 增删改都能完成
//@valus
// n,m,x都是数字 从索引n开始删除m个元素(m不写 是删除到末尾)
// n,0, x 占用删除的部分 从索引n开始一个都不删除 把x放到索引n的前面
//
//@return 把删除的部分用新的数组存储起来 返回
console.log(arr.splice(2,2),arr);//=>(2) [3, 5] (8) [1, 2, 4, 6, 7, 8, 9, 20]
console.log(arr.splice(3),arr);//=>(8) [1, 2, 4, 6, 7, 8, 9, 20] [] 清空数组
console.log(arr.splice(2,0,'hehe'),arr);//=>[] (4) [1, 2, "hehe", 4]
// 2,数组的查询和拼接
// arr.slice([@value]) 实现数组的查询
// @value
// n,m 都是数字 从索引n开始 找到索引m 的地方 （不包含m这个索引的值）
// @return
//把找到的内容以一个新数组的形式返回 不修改原数组
let arr = [1, 4654, 79, 87, 979];
console.log(arr.slice(2, 5), arr); //=>(3) [79, 87, 979] (5) [1, 4654, 79, 87, 979]
console.log(arr.slice(0)); // =>(5) [1, 4654, 79, 87, 979] 数组克隆
// concat：实现数组 拼接 数组拼接
// arr.concat([@value]) 实现数组拼接
// @value
// 任意类型数值
// @return 返回拼接后的新数组 (原数组不变)
let arr1 = [10, 20, 30, 40]
console.log(arr.concat(arr1), arr); //=>(9) [1, 4654, 79, 87, 979, 10, 20, 30, 40] (5) [1, 4654, 79, 87, 979]
console.log(arr.concat('list'), arr); // =>(6) [1, 4654, 79, 87, 979, "list"] (5) [1, 4654, 79, 87, 979]
//[@value].toString() :把数组变成字符串
// @value :
// @return 转换后的字符串 每一项用逗号分隔(原数组不变)
console.log(arr.toString(), arr);//=>1,4654,79,87,979 (5) [1, 4654, 79, 87, 979]
// join:把数组转换成字符串
// @value
// 指定的分隔符(字符串格式)
// @return
// 转换后的字符串(原来的数组不变)
console.log(arr.join('|'), arr);//=>1|4654|79|87|979 (5) [1, 4654, 79, 87, 979]
// arr.indexOf([@value])/latstIndexOf([@value])/includes([@value]) 获取元素在数组中第一次出现的位置
// @value 检索的某一项
// @return 这一项出现的位置索引值(数字)，如果没有这一项返回的结果是 -1 原数组不变
console.log(arr.indexOf(10), arr);//=>-1 (5) [1, 4654, 79, 87, 979]
console.log(arr.lastIndexOf(1), arr);//=>0 (5) [1, 4654, 79, 87, 979]
console.log(arr.includes(1), arr); //true (5) [1, 4654, 79, 87, 979] includes es6新的方法 如果存在返回true 不存在 返回false
// 3，数组的排序或者排列
// reverse() :翻转数组 把数组到过啦排序
// @value
// return 排序后的新数组 原来的数组改变
console.log(arr.reverse(), arr); //=>(5) [979, 87, 79, 4654, 1] (5) [979, 87, 79, 4654, 1]
// sort([@value]):实现数组的排序
// @value 可以没有 也可以是一个函数 如果一个字符都不传无法 处理两位数以上的字符
//@return 排序后的新数组 原数组改变
console.log(arr.sort(), arr);//=>(5) [1, 4654, 79, 87, 979] (5) [1, 4654, 79, 87, 979]
console.log(arr.sort((a, b) => {
console.log(a, b) //a和b 是相邻的两项
return a - b // 实现从大到小 b-a 实现从小到大
}));//=> 79 4654
// index.html:59 79 1
// index.html:59 87 79
// index.html:59 87 4654
// index.html:59 979 87
// index.html:59 979 4654
// index.html:58 (5) [1, 79, 87, 979, 4654]
// 简化
console.log(arr.sort((a, b) => b - a), arr);//=>(5) [4654, 979, 87, 79, 1] (5) [4654, 979, 87, 79, 1]
//4，遍历数组的每一项
// forEach
//@value 回调函数
// @return 原数组不变
arr.forEach((element, index) => { // 数组中有多少项函数就被执行多少次
console.log(element);//=> 4654,979,87,79, 1
console.log(index);// =>数组下标
});
// 5，数组去重
// 创建一个数组
var arr3 = [10, 10, 2, 2, 2, 1, 1, 1, 1, 3, 1, 1, 31, 3, 1, 3, 1]
// 创建一个空对象
let obj = {};
// 2,循环数组中的每一项 把每一项在对象中进行储存=>item：item
for (let i = 0; i < arr3.length; i++) {
let item=arr3[i];
// 每一次储存之前进行判断 验证obj中是否存在这一项
if (obj[item]!==undefined) {
// 已经存在这一项
arr3.splice(i,1); //就删除当前数组中的的值 基于splice删除 性能不好
// 如果当前项被删除 后面的每一项都会向前一位 影响性能
i--;
continue;
}
obj[item]=item;
}
console.log(arr3); //=>(5) [10, 2, 1, 3, 31]
// 基于es6 去重
let arr4=[51,46,4,631,54,85,4,41,54,15,45,4,54,5,45,45,4,54,5]
arr4=[...new Set(arr4)] //new Set 天生去重特性
console.log(arr4);
来源：CSDN
作者：吾乃cn
链接：https://blog.csdn.net/weixin_45056132/article/details/103636164