首页 > 编程语言 > 详细

数组常用方法总结

时间:2019-12-06 11:30:29      阅读:81      评论:0      收藏:0      [点我收藏+]

一、改变原数组;

1、push  数组的最后面,添加一个或者多个元素。返回值:返回的是添加元素后数组的长度。

var arr=[0,1,1,2,7];
 var len = arr.push(10);
 console.log(len) ;//6
 console.log(arr) ;//[0,1,1,2,7,10]
var arr=[0,1,1,2,7];
arr.push(1,3,3,9);
console.log(arr);//[0,1,1,2,7,1,3,3,9];
var arr=[0,1,1,2,7];
  arr.push(undefined);
  console.log(arr);//[0,1,1,2,7,undefined];
  arr.push(null);
  console.log(arr);//[0,1,1,2,7,undefined,null];
  arr.push(NaN);
  console.log(arr);//[0,1,1,2,7,undefined,null,NaN];
 arr.push();
 console.log(arr);//[0,1,1,2,7,undefined,null,NaN];
 arr.push(‘‘);
 console.log(arr);//[0,1,1,2,7,undefined,null,NaN,‘‘];

2、pop  删除数组的最后一个元素。返回值:返回的是刚才删除的元素。

 var arr=[0,1,1,2,7];
 var ele = arr.pop();//传不传值都是删除最后一个元素。
 console.log(ele) ;//7
 console.log(arr);//[0,1,1,2]

3、unshift  在数组的最前面,添加一个或者几个元素。返回值: 返回的是添加元素后数组的长度。

var arr=[0,1,1,2,7];
 var  len= arr.unshift(9,3,3,9);
 console.log(len) ;//9
 console.log(arr);//[9,3,3,9,0,1,1,2,7]

4、shift 删除数组的第一个元素。 返回值:返回刚被删除的元素。

var arr=[0,1,1,2,7];
 var  ele= arr.shift();//传不传值都是删除第一个元素。
 console.log(ele) ;//0
 console.log(arr);//[1,1,2,7]

5、reverse 翻转数组

var arr=[0,1,1,2,7];
 arr.reverse();
 console.log(arr);//[ 7, 2, 1, 1, 0 ]

6. sort 数组排序

 var arr=[13,11,1,3,9,0,2,7];
 arr.sort(); //无参数时按照首字符的先后排序
 console.log(arr);//[ 0, 1, 11, 13, 2, 3, 7, 9 ]
 arr.sort(function(a,b){
    return a-b //从小到大排序;
   // 或 return a>b
  // 或 return a-b>0
 })
 console.log(arr) ;//[ 0, 1, 2, 3, 7, 9, 11, 13 ];
 arr.sort(function(a,b){
       return b-a; //从大到小排序;
     //或 return a<b
     //或 return b-a>0;
 })
 console.log(arr);// [ 13, 11, 9, 7, 3, 2, 1, 0 ];

7、splice  可以实现添加,删除,替换功能(无返回值)

arr.splice(start,deletedCount) 纯删除 
从start下标开始,删除几个
 arr.splice(start,deletedCount,item) 替换
从start下标开始,删除几个,并在该位置添加item
 arr.splice(start,0,item) 纯添加
从start下标开始,删除0个,并在该位置添加item,start开始全部往后移动
var arr=[13,11,1,3,9,0,2,7];
 arr.splice(3,0);
   console.log(arr);//[ 13, 11, 1, 3, 9, 0, 2, 7 ]
arr.splice(3,null);
  console.log(arr); //[ 13, 11, 1, 3, 9, 0, 2, 7 ]
  arr.splice(3,undefined);
  console.log(arr);//[ 13, 11, 1, 3, 9, 0, 2, 7 ]
  arr.splice(3,NaN);
  console.log(arr);//[ 13, 11, 1, 3, 9, 0, 2, 7 ]
 arr.splice(3,1);
 console.log(arr);//[ 13, 11, 1,  9, 0, 2, 7 ]
 /*arr.splice(3,10);//deletCount过大时会删除start以及之后的所有元素
  console.log(arr); //[ 13, 11, 1 ]*/
  arr.splice(3,);
  console.log(arr); //[ 13, 11, 1 ]

二、不改变原数组。

8、slice 截取出来 。 返回值:返回截取出来的字段,放到新的数组中,不改变原数组。

 var arr=[13,11,1,3,9,0,2,7];
 //arr.slice(start,end) ;从start下标开始截取,一直到end结束,不包括end
/* var newArr = arr.slice(3,6)
 console.log(newArr);//[3,9,0]*/
/* var newArr = arr.slice(3,50);
 console.log(newArr);// [ 3, 9, 0, 2, 7 ]*/
/* var newArr = arr.slice(3,null);
 console.log(newArr);//[];*/
/* var newArr = arr.slice(3,undefined);
 console.log(newArr); // [ 3, 9, 0, 2, 7 ]*/
/* var newArr = arr.slice(3,);
 console.log(newArr); //[ 3, 9, 0, 2, 7 ]*/
/* var newArr = arr.slice(3,0);
 console.log(newArr);//[];*/
 //arr.slice(start) ;从start下标开始截取,一直到最后
/* var newArr = arr.slice(3);
 console.log(newArr);//[ 3, 9, 0, 2, 7 ]*/
//arr.slice( ) ;全部截取
var newArr = arr.slice();
 console.log(newArr);//[ 13, 11, 1, 3, 9, 0, 2, 7 ]

9、concat 把两个数组里的元素拼接成一个新的数组  返回值: 返回拼接后的新数组

var arr1 = [1,3,5];
var arr2 = [2,4,6];
/*var arr = arr1.concat(arr2);
console.log(arr); //[ 1, 3, 5, 2, 4, 6 ]*/
/*var arr = arr1.concat(null);
console.log(arr) //[ 1, 3, 5, null ]*/
/*var arr = arr1.concat(undefined);
console.log(arr) //[ 1, 3, 5, undefined ]*/
var arr = arr1.concat(NaN);
console.log(arr) //[ 1, 3, 5, NaN ]

10、join 将数组里的元素,通过指定的分隔符,以字符串的形式连接起来  返回值:返回一个新的字符串

var arr = [1,3,5];
var str = arr.join("-")
console.log(str) ;//‘1-3-5‘

11、indexOf() 查找元素在数组中第一次出现的位置,元素不存在返回 -1。

var arr = [1,3,5,7,9,5,2];
/*var index = arr.indexOf(5);
console.log(index) ;//2*/
var index = arr.indexOf(8);
console.log(index) ;//-1

特殊用法:arr.indexOf(ele,fromIndex)  从fromIndex这个下标开始,元素第一次出现的位置

var arr = [1,3,5,7,9,5,2];
var index = arr.indexOf(5,3);
console.log(index) ;//5

12、lastIndexOf() 查找元素最后一次在数组中出现的位置,元素不存在返回 -1。

var arr = [1,3,5,7,9,5,2];
/*var index = arr.lastIndexOf(5);
console.log(index) ;//5*/
var index = arr.lastIndexOf(8);
console.log(index) ;//-1

三、遍历数组

es5 新增遍历数组方法。

13、forEach(匿名函数)  没有返回值。

用法:arr.forEach(function(item,index,array){

        // item表示数组中的元素;index表示元素下标;array表示遍历的数组。

})

var arr = [1,3,5,7,9,5,2];
var newArr = arr.forEach(function(item,index,array){
    console.log(item+"-"+index); 
    return item*3;
})
console.log(newArr) //undefined

 

技术分享图片

 

 

 14、map() 映射 遍历数组---修改数组--返回新数组(返回值)。

用法和forEach一样。

var arr = [1,3,5,7,9,5,2];
var newArr = arr.map(function(item,index,array){
    console.log(item+"-"+index); 
    return item*2
})
console.log(arr);//[1,3,5,7,9,5,2];
console.log(newArr);//[ 2, 6, 10, 14, 18, 10, 4 ]

 

 

 

 技术分享图片

 

 

 15、filter() 有返回值, 过滤出符合条件的元素。

var arr = [1,3,5,7,9,5,2];
var res = arr.filter(function(item,index){ 
    return item*3==9;
})
console.log(res) //[3]
   //过滤布尔值为true的元素
var arr = [1,"",0,false,9,null,‘ ‘,2,undefined,NaN,11,-2,‘g‘];
var res = arr.filter(function(item,index){ 
    return item
})
console.log(res) //[ 1, 9, " ", 2, 11, -2, "g" ]

es6新增数组方法

16、some 判断数组中有没有符合条件的项(只要有,就返回true),如果一个都没有,才返回false.

 var arr=[
     {name:‘王大锤‘,age:‘18‘,work:"IT"},
     {name:‘肖鹿‘,age:‘20‘,work:"postgraduate"},
     {name:‘格林尼治‘,age:‘33‘}]
var res1 = arr.some(function(item){
     return item.work;
})
console.log(res1) //true
var res2 = arr.some(function(item){
    return item.sex;
})
console.log(res2)//false

17、every 判断数组中所有的项是否满足要求,如果全都满足,才返回true,否则返回false

 var arr=[
     {name:‘王大锤‘,age:‘18‘,work:"IT"},
     {name:‘肖鹿‘,age:‘20‘,work:"postgraduate"},
     {name:‘格林尼治‘,age:‘33‘}]
var res1 = arr.every(function(item){
     return item.work;
})
console.log(res1) //false
var res2 = arr.every(function(item){
    return item.age;
})
console.log(res2)//true

18、find  找到符合条件的项的下标,并且返回第一个

var arr=[
     {name:‘王大锤‘,age:‘18‘,work:"IT"},
     {name:‘肖鹿‘,age:‘20‘,work:"postgraduate"},
     {name:‘格林尼治‘,age:‘33‘}]
var res1 = arr.find(function(item){
     return item.work;
})
console.log(res1) //{ name: "王大锤", age: "18", work: "IT" }

19、findIndex 返回第一个符合条件的元素的下标。

 var arr=[
     {name:‘王大锤‘,age:‘18‘,work:"IT"},
     {name:‘肖鹿‘,age:‘20‘,work:"postgraduate"},
     {name:‘格林尼治‘,age:‘33‘}]
var res1 = arr.findIndex(function(item){
     return item.work;
})
console.log(res1) //0

20、reduce  求和计算 (https://www.jianshu.com/p/e375ba1cfc47

语法:arr.reduce(callback,initialValue)

var arr = [1,2,3,4,5];

*第一次:pre–>1 next–>2 index–>1
pre+next=1+2=3
*第二次:pre–>3 next–>3 index–>2
pre+next=3+3=6
*第三次:pre–>6 next–>4 index–>3
pre+next=6+4=10
*第四次:pre–>10 next–>5 index–>4

var arr=[1,2,3,4,5]
var sum = arr.reduce(function(pre,next,index){
    return pre+next;//1+2+3+4+5=15;
})//没有设置初始值
console.log(sum)//15
var arr=[1,2,3,4,5]
var sum = arr.reduce(function(pre,next,index){
    return pre+next;//9+1+2+3+4+5=24;
},9)//初始值设为9
console.log(sum)//24

注意:如果空数组用reduce方法会报错,最好设置个init值为0.

var arr=[]
var sum = arr.reduce(function(pre,next,index){
    return pre+next;
})//无初始值
console.log(sum)//TypeError: reduce of empty array with no initial value
var arr=[]
var sum = arr.reduce(function(pre,next,index){
    return pre+next;
},0)//初始值设为0
console.log(sum)//0;

高级用法:

 //计算数组中每个元素出现的次数
var arr=[1,2,11,3,2,1,7,9,3]
var nameNum = arr.reduce(function(pre,next){
    if(next in pre){
        pre[next]++
    }else{
        pre[next] = 1
    }
    return pre
},{})
console.log(nameNum)//{1:2,2:2,3:2,7:1,9:1,11:1}
    //数组去重
var arr=[1,2,11,3,2,1,7,9,3]
var newArr = arr.reduce(function(pre,next){
    if(!pre.includes(next)){
        return pre.concat(next)
    }else{
        return pre
    }
},[])
console.log(newArr)//[ 1, 2, 11, 3, 7, 9 ]
   //二维数组转一维 
var arr=[[1,2],[11,3,2],[1,7,9,3]]
var newArr = arr.reduce(function(pre,next){
    return pre.concat(next)
},[])
console.log(newArr)//[ 1, 2, 11, 3, 2, 1, 7, 9, 3 ]
    //多维数组转一维 也可以用es6的flat()方法 https://blog.csdn.net/qq_41993503/article/details/102470692,但是高版本浏览器支持,低版本不支持此方法。
var arr=[[1,2],[11,3],[2,[1,7,9,3]]]
var newArr = function(arr){
    return arr.reduce((pre,next)=>pre.concat(Array.isArray(next)?newArr(next):next),[])
}
console.log(newArr(arr))//[ 1, 2, 11, 3, 2, 1, 7, 9, 3 ]
 //对象里的属性求和
    var result = [
    {
        subject: ‘math‘,
        score: 10
    },
    {
        subject: ‘Chinese‘,
        score: 20
    },
    {
        subject: ‘English‘,
        score: 30
    }
];
var sum = result.reduce(function(pre,next){
    return next.score+pre
},0)
console.log(sum)//60

 



 

 

数组常用方法总结

原文:https://www.cnblogs.com/summer-xiao/p/11994183.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!