javascript
javascript对于数组对象有很多函数，熟练的运用这些函数，对于我们日常的工作有很大的帮助。
下面简单的分享一下10个简单的js对于处理数组的方法，希望能抛砖引玉。
1，数组去重复，这个的实现原理和过程就是遍历原来的数组arrOld，判断arr有没有当前遍历到的数组元素，没有加添加进去
function removeReapt(arrOld){
var arr=[];
for(var i=0,len=arrOld.length;i<len;i++){
if(arr.indexOf(arrOld[i])==-1){
arr.push(arrOld[i]);
}
}
return arr;
}
removeReapt([1,2,3,6,5,2,2,5,6,2,1]) // [1, 2, 3, 6, 5]
2，数组最大值最小值，这一块的封装，主要是针对数字类型的数组，是通过js的Math 对象来实现的，我们还可以通过遍历数组，比较每一个值的大小来封装
function maxArr(arr){
return Math.max.apply(null,arr);
}
function minArr(arr){
return Math.min.apply(null,arr);
}
maxArr([1,4,65,843,2,1,4]) // 843
minArr([1,4,65,843,2,10,4]) // 1
3，数组求和，平均值，这一块的封装，主要也是是针对数字类型的数组。其中对于平均值小数点可能会有很多位，这里没有做处理。如果要处理，我们可以用js的向下取整Math.floor或者向上取整Math.ceil等函数来实现
//求和
function sumArr(arr){
var sumText=0;
for(var i=0,len=arr.length;i<len;i++){
sumText+=arr[i];
}
return sumText
}
// 平均值
function covArr(arr){
var sumText=sumArr(arr);
var covText=sumText/arr.length;
return covText
}
sumArr([1,4,65,843,2,1,4]) // 920
covArr([1,4,65,843,2,1,4]) // 131.42857142857142
4，从数组中随机获取元素
function randomOne(arr) {
return arr[Math.floor(Math.random() * arr.length)];
}
randomOne([1,2,3,6,8,5,4,2,6]) // 1
5，返回对应元素在数组中的下标
function isHasElementOne(arr,value){
for(var i = 0,vlen = arr.length; i < vlen; i++){
if(arr[i] == value){
return i;
}
}
return -1;
}
isHasElementOne([1,2,3,4,5],3) // 2
6，返回数组（字符串）一个元素出现的次数
function getEleCount (obj, ele) {
var num = 0;
for (var i = 0, len = obj.length; i < len; i++) {
if (ele == obj[i]) {
num++;
}
}
return num;
}
getEleCount('asd56+asdasdwqe','a') // 3
getEleCount([1,2,3,4,5,66,77,22,55,22],22) // 2
7，得到n1-n2下标的数组，即返回数组下标arr[n1]到数组arr[n2]的值
function getArrayNum(arr,n1,n2){
var arr1=[],len=n2||arr.length-1;
for(var i=n1;i<=len;i++){
arr1.push(arr[i])
}
return arr1;
}
getArrayNum([0,1,2,3,4,5,6,7,8,9],5,9) // [5, 6, 7, 8, 9]
8，筛选数组，这里所做的就只是删除相应的数组，大家可以按需要扩展
/* arr:要进行操作的数组
val:要删除的值
type: 如果有值，则删除数组中所有含有val值的元素，如果没值或者不指定，则删除必须完全匹配val的值
*/
function removeArrayForValue(arr,val,type){
return arr.filter(function (item) {
return type? item.indexOf(val) === -1 : item !== val
})
}
removeArrayForValue(['test','test1','test2','test','aaa'],'test','%') // ["aaa"]
removeArrayForValue(['test','test1','test2','test','aaa'],'test')
// ["test1", "test2", "aaa"]
9，根据id的值获取相应的item值，并存入相应的目标数组，如果数组里面的对象里面还有children的item的时候，我们可以使用递归
function findItemByOrgModuleId(arr, id, resArr) {
arr.forEach(function(item){
if (item.id === id) {
resArr.push(item);
}
});
return resArr;
}
var resArr = []; // 存放结果的目标数组
var arr = [
{id:1,name:'aaa'},
{id:2,name:'bbb'},
{id:3,name:'ccc'},
{id:4,name:'ddd'},
{id:4,name:'555'},
]; // 要操作的数组
findItemByOrgModuleId(arr,4,resArr) // [{id:4,name:'ddd'},{id:4,name:'555'}]
10，根据id来删除数组中相应id的对象，这里默认所有的id都是唯一的
function deleteById(arr, id) {
arr.forEach(function(item, i){
if (item.id === id) {
arr.splice(i, 1);
}
});
return arr;
}
var arr = [
{id:1,name:'aaa'},
{id:2,name:'bbb'},
{id:3,name:'ccc'},
{id:4,name:'ddd'},
{id:5,name:'555'},
]; // 要操作的数组
deleteById(arr,5)
// [{id:1,name:'aaa'},{id:2,name:'bbb'},{id:3,name:'ccc'},{id:4,name:'ddd'}];
如果arr中的item值有子元素话，我们需要遍历，如下
// 如果arr对象如下所示
var arr = [
{id:1,name:'aaa'},
{id:2,name:'bbb'},
{id:3,name:'ccc'},
{id:4,name:'555'},
{id:5,name:'555',children: [
{id: 6,name:'666'},
{id: 7,name:'777'},
{id: 8,name:'888'},
]},
]
function deleteById(arr, id) {
arr.forEach(function(item, i){
if (item.id === id) {
arr.splice(i, 1);
}
if (item.children && item.children.length) {
deleteById(item.children, id);
}
});
return arr;
}
deleteById(arr,6)
结果返回了将id等于6的值删除之后的新的数组。如下图所示
image
附加：下面是js的数组常用的常用api，具体的使用方法大家可以参考相应的w3cschool相应的api的demo。
-
concat()：连接两个或更多的数组，并返回结果
-
join()：把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔
-
pop()：删除并返回数组的最后一个元素
-
push()：向数组的末尾添加一个或更多元素，并返回新的长度
-
reverse()：颠倒数组中元素的顺序
-
shift()：删除并返回数组的第一个元素
-
slice()：从某个已有的数组返回选定的元素
-
sort()：对数组的元素进行排序
-
splice()：删除元素，并向数组添加新元素
-
toString()：把数组转换为字符串，并返回结果
-
unshift()：向数组的开头添加一个或更多元素，并返回新的长度
-
valueOf()：返回数组对象的原始值
结语：此篇文章是受了 编写自己的代码库（javascript常用实例的实现与封装 作者的启发。
文章中加了自己的一些测试数据和自己工作用到的几个库，希望能给大家带来一点启发。
来自一个奔跑在前端路上的前端小白。
网友评论