数组的操作方法

Posted ly1368489670

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了数组的操作方法相关的知识,希望对你有一定的参考价值。

例如let arr = [1,4,5,7,9];

 

1.判断数组中某个元素是否存在 indexOf

para1:待判断的元素

返回值:元素在数组中的索引,如果不存在,返回-1

 let isExist = arr.indexOf(4) !=-1;

2、向数组中追加元素 push

para1:要追加的元素

返回值是数组的长度;

 arr.push(100);

3、在数组的开头添加元素 unshift

para1:待添加的元素

返回值是数组的长度

场景:下拉刷新

arr.unshift(-2); 

4、删除数组结尾的元素 pop

无参数

返回值是删除的元素

 let e= arr.pop();
 
console.log(e);//100

5、删除数组开头的元素 shift

返回值是删除的元素

arr.shift();

6、从数组中删除一些元素,插入一些元素; splice

para1:开始索引

para2:删除元素的数目(开始索引是删除的起始位置)

para3...:要插入的元素(开始索引也就是插入的位置,可以插入多个)

场景:用新元素替换旧数组的一个元素

返回值是被删除的元素构成的数组;

console.log(arr)
 
let de= arr.splice(1,2,1000,200);
 //可以删可以加

7、获取一个子数组 slice

para1:开始位置;包含开始

para2:结束位置;不包含结束 [start,end);

返回值是子数组;

let s= arr.slice(1,3);
 
console.log(s)

8、数组的拼接 concat

console.log(arr);
 
let arr2=[-1,-2,90]

para1.....:待拼接的数组(可以拼接多个)

返回值拼接之后的新数组;(arr)原数组不受影响

let c= arr.concat(arr2);
 
console.log(c);
 
console.log(arr);

弱类型语言可以多个参数,强类型的参数是固定的

9、数组的遍历 forEach

参数: 元素,索引,所在的数组

para1:操作函数

   para1:元素
?
    para2:索引
?
    para3:元素所在的数组
arr.forEach((item,index,array)=>{
 
    console.log(item)
 
    console.log(index)
 
    console.log(array)
 
    // 想要进行的操作:无明确要求
 
})

 

10、数组的映射

para1:操作函数

     para1:元素
?
    para2:索引
?
    para3:元素所在的数组
?
    返回值是该元素映射的新元素(一一对应)

返回值是映射得到的新数组

 let m= arr.map((item,index,array)=>{
 
    return item*3;
 
})
 
console.log(m);
 
 
 
let stus = [
 
    {name:‘lucy‘,age:20},
 
    {name:‘lily‘,age:21},
 
    {name:‘小兰‘,age:20},
 
]
 
let stuNames = stus.map((item)=>{
 
    return item.name;
 
})
 
console.log(stuNames);
?

11、数组的聚合 reduce

 para1:操作函数

         para1:旧值;上一次聚合的结果;

         para2:当前元素

         para3:当前元素的索引

         para4:当前元素所在的数组

         返回值:该次聚合的结果

 para2:聚合时使用的初值(0加,1乘)

 返回值是 聚合后的数据

let rd=arr.reduce((preValue,curValue,curIndex,array)=>{
 
    console.log(‘1111111111111‘);
 
    // console.log(preValue);
 
    // console.log(curValue);
 
    console.log(curIndex);
 
    // console.log(array);
 
    return preValue+curValue;
 
},0)
 
console.log(rd);
 
 
 
// [1,10000,200,7,9]
 
// 初值:0 
 
// 第一次    0     1    0      1 
 
// 第二次    1    10000  1     10001
 
// 第三次  10001  200    2    10201
 
// 第四次  10201  7      3     10208
 
// 第五次  10208  9      4     10217 
 
// 返回值是 10217
 
 
 
// 计算每个字母出现的频率
 
let str =‘fsadfasdfagagajkgnahjgasdjfajsfjk‘;
 
let strArr=str.split(‘‘);
 
console.log(strArr);
 
let sr=strArr.reduce((preValue,curValue,curIndex,array)=>{
 
    if(!preValue[curValue]){
 
        preValue[curValue]=0;
 
    }
 
    preValue[curValue] +=1;
 
    console.log(preValue);
 
    return preValue;
 
},{})
 
console.log(sr);
 

12、数组过滤 filter

 para1:操作函数

         para1:元素

         para2:索引

         para3:元素所在的数组

         返回值 true/false ; true:满足条件;false:不满足条件

返回值是 满足过滤条件的新数组

let fa = arr.filter((item,index,array)=>{
 
    return item%2==0;
 
})
 
console.log(fa);

13、数组排序 sort

para1:操作函数

 para1:数组中一个元素
?
para2:数组中另一个元素
?
返回值是true/false;

返回值排序后的新数组

let sortedArr=arr.sort((num1,num2)=>{
 
    return num1>num2;//升序
 
    // return num1<num2;//降序
 
});
 
console.log(sortedArr);
 
 
 
let goods=[
 
    {name:"裙子",price:37,sales:10000},
 
    {name:‘裙子‘,price:100,sales:100},
 
    {name:‘裙子‘,price:340,sales:102},
 
    {name:‘裙子‘,price:734,sales:16},
 
    {name:‘裙子‘,price:1235,sales:10},
 
    {name:‘裙子‘,price:3214,sales:6},
 
    {name:‘裙子‘,price:777,sales:60},
 
]
 
let sortedGoods=goods.sort((obj1,obj2)=>{
 
    console.log(obj1.price);
 
    return obj1.price<obj2.price;
 
})
 
console.log(sortedGoods);

14、判断一个变量是不是数组 isArray

返回值是true或者false

let a=1;
 
// let a=[1,2];
 
console.log(Array.isArray(a)); //Array是一个类
 
console.log(a instanceof Array);//instanceof 关键字

数组中最大的元素

 let arrt1=[1,5,6,43,99,42,3];
 
// 第一种方法。数组中不能有重复元素,推荐第二种
 
let sor1=arrt1.sort((num,num3)=>{
 
    return num>num3
 
})
 
console.log(sor1);
 
sort=sor1[0];
 
sort2=sor1[sor1.length-1];
 
console.log(sort);
 
console.log(sort2);
 
 
// 第二种方法

let num4;
 
let str1=arrt1.forEach((item)=>{
 
    num4=num4>item ? num4 : item
 
    return num4
 
})
 
console.log(num4)
 

以上是关于数组的操作方法的主要内容,如果未能解决你的问题,请参考以下文章

几个关于js数组方法reduce的经典片段

几个关于js数组方法reduce的经典片段

有人可以在快速数组中给出“如果不存在则追加”方法的片段吗?

为什么我不能在此片段中生成唯一对象数组?

10个JavaScript代码片段,使你更加容易前端开发。

10个JavaScript代码片段,使你更加容易前端开发。