数组常用方法总结-功能、参数、返回值
- 1.会改变原有数组方法
- （1）push、pop-最后元素增删
- （2）unshif、shif-最前元素增删
- （3）splice-元素删除与添加
- （4）copyWithin-复制元素
- （5）sort-数组排序
- （6）reverse-数组排序
- 2.不会改变原有数组方法
- 2.1 判断方法
- （1）isArray() -判断是否是数组
- 2.2 操作方法
- （1）concat-拼接数组
- （2）slice-截取数组
- 2.4 查询方法
- （1.1）indexOf-查找元素第一次出现
- （1.2）lastIndexOf-查找元素最后一次出现
- （2）includes-查找元素
- （3.1）find-匹配元素
- （3.2）findfindIndex-匹配元素
- 2.3 转换方法
- （1.1）split-字符串拆分成数组
- （1.2）（...）-字符串转为成数组
- （2）join-数组转为字符串整体
- （3）toString()-数组转为字符串
- 2.4 迭代方法
- （1）forEach
- （2.1）some()-检测数组
- （2.2） every()-检测数组
- （3）filter()-过滤数组
- （4）map()-映射
- （5）reduce-累加元素
用简单的js示例
运行在线工具：链接: 菜鸟工具 菜鸟工具示意图：
1.会改变原有数组方法
（1）push、pop-最后元素增删
push
-功能：在数组的最后面,添加一个或者多个元素
-参数：array.push(item1, item2, …, itemX),参数可以是字符串、数组、对象等
-返回值:添加元素后数组的长度.
let arr = [1,2,3,4,5];
let arrnew=arr.push(3)
console.log(arr);//[1, 2, 3, 4, 5, 3]
console.log(arrnew);//6pop
-功能：在数组的最后面,删除一个元素
-参数：array.pop()无参数
-返回值:返回的是刚才删除的元素.
let arr = [1,2,3,4,5];
let arrnew=arr.pop()
console.log(arr);//[1, 1, 2, 3, 4]
console.log(arrnew);5（2）unshif、shif-最前元素增删
unshift
-功能：在数组的最前面,添加一个或者几个元素
-参数：array.unshift(item1,item2, …, itemX),参数可以是字符串、数组、对象等
-返回值:添加元素后数组的长度.
let arr = [1,2,3,4,5];
let arrnew=arr.unshift(1)
console.log(arr);//[1, 1, 2, 3, 4, 5]
console.log(arrnew);6shift
-功能：在数组的最前面,删除一个元素
-参数：arr.shift()无参数
-返回值:返回的是刚才删除的元素.
let arr = [2,3,4,5];
let arrnew=arr.shift()
console.log(arr);//[3, 4, 5]
console.log(arrnew);//2（3）splice-元素删除与添加
-功能：添加或删除数组中的元素
-参数：array.splice(index,howmany,item1,…,itemX)
从index下标开始,删除howmany个,并在该位置添加item
（其中index参数必须）
-返回值：含有被删除的元素的数组
//arr.splice(start,deletedCount,item)
let arr = [1,2,4,17,3];
let arrnew=arr.splice(1,3,7)
console.log(arr);//[1,7, 3]
console.log(arrnew);// [2, 4, 17]//arr.splice(start,deletedCount)
let arr = [1,2,4,17,3];
let arrnew=arr.splice(1,3)
console.log(arr);//[1, 3]
console.log(arrnew);// [2, 4, 17]//arr.splice(start,0,item)
let arr = [1,2,4,17,3];
let arrnew=arr.splice(1,0,7)
console.log(arr);// [1, 7, 2, 4, 17, 3]
console.log(arrnew);// []（4）copyWithin-复制元素
-功能：从数组的指定位置拷贝元素到数组的另一个指定位置中
-参数：array.copyWithin(target, start, end)
其中target为必须参数，其余可选
-返回值:返回改变后的新数组
const arr1 = [1,2,3,4,5];
const arrnew = arr1.copyWithin(2, 0, 2);
console.log(arr1);//[1, 2, 1, 2, 5]
console.log(arrnew);//[1, 2, 1, 2, 5]（5）sort-数组排序
-功能：对数组的元素进行排序。
-参数1：无参数
-返回值:将按照ASCII字符顺序进行排序
(如果数组元素是数字，sort方法会调用每一个数组项的toString()方法，获得字符串，而后再对获得的字符串进行排序);
(如下实例数组元素是数字，无参数，所以17会排在2的前面）
//无参数，17在2的前面
let arr = [1,2,4,17,3];
let arrnew=arr.sort();
console.log(arr);//[1, 2, 3, 4, 17]
console.log(arrnew);//[1, 2, 3, 4, 17]-参数2：arr.sort(function(a,b){}）回调函数，其中b值在a值前面
-返回值:
如果返回值大于 0，则位置互换。
如果返回值小于 0，则位置不变。
a-b输出从小到大排序
b-a输出从大到小排序。
//有参数
let arr = [1,2,4,17,3];
let arrnew=arr.sort(function(a,b){
return a-b;
});
console.log(arr);//[1, 2, 3, 4, 17]
console.log(arrnew);// [1, 2, 3, 4, 17]（6）reverse-数组排序
-功能：对数组的元素进行翻转。
-参数：array.reverse()无参数
-返回值:颠倒顺序的数组
let arr = [1,2,4,7,3];
let arrnew=arr.reverse();
console.log(arr);//[3, 7, 4, 2, 1]
console.log(arrnew);//[3, 7, 4, 2, 1]2.不会改变原有数组方法
2.1 判断方法
（1）isArray() -判断是否是数组
-功能：判断是否是数组。
-参数：Array.isArray(arr)，参数为要判断的对象
-返回值:如果对象是数组返回 true，否则返回 false。
let arr = [1,2,4,7,3];
let arrnew=Array.isArray(arr);
console.log(arr);//[3, 7, 4, 2, 1]
console.log(arrnew);//true2.2 操作方法
（1）concat-拼接数组
-功能：连接两个或更多的数组
-参数：array1.concat(array2, array3,…, arrayX)
-返回值:返回拼接后的新数组
-concat和push的区别：push是将参数作为整体直接加到数组最后一个，并且返回值是新数组长度，如下例子push后的结果应为[1,2,3,4,5,[a,b]]所以返回的长度为6）
const arr1 = [1,2,3,4,5];
const arr2 = ['a','b'];
const arrnew = arr1.concat(arr2);
const arr3 = arr1.push(arr2);
console.log(arr1);//[1, 2, 3, 4, 5]
console.log(arr2);
console.log(arrnew);//[1, 2, 3, 4, 5, 'a', 'b']
console.log(arr3);//6（2）slice-截取数组
-功能：从数组中截取指定的字段
-参数1：arr.slice(start,end)从start下标开始截取,一直到end结束,不包括end
-返回值:返回截取的新数组
let arr = [1,2,3,4,5];
let arrnew=arr.slice(2,3)
console.log(arr);//[1, 2, 3, 4, 5]
console.log(arrnew);//[3]-参数2：arr.slice(start) ;从start下标开始截取,一直到最后
let arr = [1,2,3,4,5];
let arrnew=arr.slice(3)
console.log(arr);//[1, 2, 3, 4, 5]
console.log(arrnew);//[4, 5]-参数3：arr.slice( ) ;全部截取
let arr = [1,2,3,4,5];
let arrnew=arr.slice()
console.log(arr);//[1, 2, 3, 4, 5]
console.log(arrnew);//[1, 2, 3, 4, 5]2.4 查询方法
（1.1）indexOf-查找元素第一次出现
-功能：查找元素在数组中第一次出现的位置，可以用来判断数组是否含有该元素
-参数1：arr.indexOf (element,fromIndex),从fromIndex这个下标开始，（从左往右）元素第一次出现的位置
-返回值：查找到的元素的下标（若无此元素，返回-1）
let arr = [1,2,4,6,3];
let arrnew=arr.indexOf(4)
if (arr.indexOf(4) === -1){
console.log('元素不存在')
} else {
console.log(' 元素存在!')
}
console.log(arr);// [1,2,4,6,3];
console.log(arrnew);// 2（1.2）lastIndexOf-查找元素最后一次出现
-功能：查找元素在数组中最后出现的位置
-参数1：arr.lastIndexOf (element,fromIndex),从fromIndex这个下标开始,（从右往左）元素最后一次出现的位置
（这里最后一项是按照数组从左往右的最后一项）
（虽然是从右往左搜索，但返回的位置是从左往右数的）
-返回值：查找到的元素的下标（若无此元素，返回-1）
let arr = [1,2,4,6,4,3];
let arrnew=arr.lastIndexOf(4)
let arrnew2=arr.lastIndexOf(4,1)
console.log(arr);// [1, 2, 4, 6, 4, 3]
console.log(arrnew);// 4
console.log(arrnew2);// -1（2）includes-查找元素
-功能：判断一个数组是否包含一个指定的值
-参数1：arr.includes (searchElement,fromIndex)
searchElement:必须；fromIndex可选
-返回值：如果是返回 true，否则false
let arr = [1,2,3,4,5];
let arrnew=arr.includes(1)
console.log(arr);// [1, 2, 3, 4, 5]
console.log(arrnew);//true（3.1）find-匹配元素
-功能：find找到符合条件的项，
-参数：array.find(function(currentValue, index, arr),thisValue)
-返回值：返回符合测试条件的第一个数组元素值，如果没有符合条件的则返回 undefined。
let arr = [1,2,3,4,5];
let arrnew=arr.find(function(item){
return item < 4
})
console.log(arr);// [1, 2, 3, 4, 5]
console.log(arrnew);//1（3.2）findfindIndex-匹配元素
-功能：findIndex找到符合条件的项的下标
-参数：array.findIndex(function(currentValue, index, arr), thisValue)
-返回值：返回第一项下标，如果没有符合条件的则返回 -1
let arr = [1,2,3,4,5];
let arrnew=arr.findIndex(function(item){
return item < 4
})
console.log(arr);// [1, 2, 3, 4, 5]
console.log(arrnew);//02.3 转换方法
（1.1）split-字符串拆分成数组
-功能：用指定的分隔符,将字符串分割成数组。
-参数：参数为要分隔的值
-返回值:一个新的数组
const str = 'test-arry';
const arr = str.split('-');
console.log(str);//test-arry
console.log(arr);//['test', 'arry']（1.2）（…）-字符串转为成数组
-功能：将字符串分割成数组。
-参数：无
-返回值:一个新的数组
let arr1 = 'hello';
let arr2 = [...'hello'];
console.log(arr1)//hello
console.log(arr2)//['h', 'e', 'l', 'l', 'o']（2）join-数组转为字符串整体
-功能：将数组里的元素,通过指定的分隔符,以字符串的形式连接起来
-参数：array.join(separator)
separator指定要使用的分隔符。如果省略该参数，则使用逗号作为分隔符。
-返回值:一个新的字符串
const arr1 = [1,2,3,4,5];
const arrnew = arr1.join('-');
console.log(arr1);//[1, 2, 3, 4, 5]
console.log(arrnew);//1-2-3-4-5（3）toString()-数组转为字符串
-功能：把数组转换为字符串，数组中的元素之间用逗号分隔。
-参数：array.toString()
-返回值:一个新的字符串
const arr1 = [1,2,3,4,5];
const arrnew = arr1.toString()
console.log(arr1);//[1, 2, 3, 4, 5]
console.log(arrnew);//1,2,3,4,52.4 迭代方法
（1）forEach
-功能：调用数组的每个元素，并将元素传递给回调函数
-参数：array.forEach(callbackFn(currentValue, index, arr), thisValue)
-返回值：没有返回值
const arr = [1,2,3,4,5];
const arrnew = arr.forEach(function(item,index,arr){
item=item+1
});
console.log(arr);//[1, 2, 3, 4, 5]
console.log(arrnew)//undefined（2.1）some()-检测数组
-功能：some（）检测是否有元素符合指定条件，一旦找到，则不会继续迭代下去。
-参数：array.some(function(currentValue,index,arr),thisValue)
-返回值:符合true；不符合false
let arr = [1,2,3,4,5];
let arrnew=arr.some(function(item){
return item < 2
})
let arrnew2=arr.every(function(item){
return item < 2
})
console.log(arr);// [1, 2, 3, 4, 5]
console.log(arrnew);//true
console.log(arrnew2);//false（2.2） every()-检测数组
-功能：every（）检测每个元素是否都符合条件；一旦有一个不符合条件，则不会继续迭代下去。
-参数：array.every(function(currentValue,index,arr), thisValue)
-返回值:符合true；不符合false
（3）filter()-过滤数组
-功能：通过检查指定数组中符合条件的所有元素
-参数arr.filter(function(currentValue,index,arr), thisValue)
-返回值:返回一个新数组
let arr = [1,2,3,4,5];
let arrnew=arr.filter(function(item,index,arr){
return item>2
})
console.log(arr);// [1, 2, 3, 4, 5]
console.log(arrnew);// [3, 4, 5]（4）map()-映射
-功能：对数组每一项都运行传入的函数
-参数：array.map(function(currentValue,index,arr), thisValue)
currentValue必须值，表示数组每一项元素
index: 对应的下标索引值
arr: 就是调用该方法的数组本身
thisValue：如果没有默认null或者undefined
-返回值：由每次函数调用的结果构成的数组
let arr = [1,2,3,4,5];
let arrnew=arr.map(function(item,index,arr){
return item*2
})
console.log(arr);// [1, 2, 3, 4, 5]
console.log(arrnew);// [2, 4, 6, 8, 10]（5）reduce-累加元素
-功能：接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值；可以作为一个高阶函数，用于函数的 compose
-参数：array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
total：必需。初始值, 或者计算结束后的返回值。
-返回值：由每次函数调用的结果构成的数组
-可计算数组总和、扁平化数组、数组去重、计算元素出现次数等
//计算数组总和
let arr = [1,2,3,4,5];
let arrnew=arr.reduce(function(total,item){
return total+item
})
console.log(arr);// [1, 2, 3, 4, 5]
console.log(arrnew);//15
//二维数组转为一维数组
let arr = [[1, 2], [2, 3], [4, 5], [6, 7]]
let arrnew = arr.reduce((a, b) => {
return a.concat(b)
}, [])
console.log(arrnew)//[1,2,2,3,4,5,6,7]
//数组去重
let arr = [1,2,3,4,4,1]
let newArr = arr.reduce((pre,cur)=>{
if(!pre.includes(cur)){
return pre.concat(cur)
}else{
return pre
}
},[])
console.log(newArr);// [1, 2, 3, 4]
//计算每个元素出现的次数
let arr = [1,2,1,3,4,3]
let arrnew = arr.reduce((pre,cur) =>{
if( cur in pre){
pre[cur]++
}
else{
pre[cur] = 1
}
return pre
}, {})
console.log(arrnew) // {1: 2, 2: 1, 3: 2, 4: 1}参考： 1.数组的常用方法大全 2.菜鸟教程: JavaScript Array 对象
