• js最全面的数组操作合集


    一.数组添加、删除、替换、截取操作

    1.arr.unshift(1)

    在数组头部添加一个元素 1 (直接改变原数组,返回值为添加元素后数组的length)

    2.arr.shift()

    在数组的头部删除一个元素 (直接改变原来数组,返回值为删除的元素)

    3.arr.push(1)

    在数组末尾添加一个元素 1(直接改变原数组,返回值为添加元素后数组的length)

    4.arr.pop()

    删除数组最后一个元素。(直接改变原数组,返回值为删除的位数 1 )

    5.arr.splice(index,number,exchange)

    删除或替换元素。(改变原数组,返回值为删除或替换掉的元素组成的数组。index是删除或替换的位置为必填,number是要删除或替换为位数为必填,exchange为要替换的值为选填且可为多个值。)

    6.arr.slice(start,end);

    截取数组 (不改变原数组,返回值为截取的数组,start开始窃取,到end之前一个元素,注意:end不考虑在截取的范围内)
    特殊用法:深度拷贝数组 let a = arr.slice(0);

    let arr = [1,2,3,4,5,6];
    let a = arr.slice(2); //从index 2位置截取到数组末尾。a为 [3,4,5,6]       *注:如果只有start,end默认为0*
         a = arr.slice(2,6); 从index 2位置截取到index 6-1 的位置。a为 [3,4,5]
    

    7.arr.concat(arr1,arr2,...);

    不改变原来数组值,返回为 多个数组按照顺序组合而成的新的数组,同ES6 中 [...arr,...arr1,...arr2] 效果一致。
    特殊用法:深度拷贝数组 let a = arr.concat();

    二.数组与字符串的相互转化

    1.arr.join('连接符号') ;

    数组转换为字符串 (连接符号为空时,默认以 “,” 连接);

    2.str.split('分割字符');

    字符串转换为数组 (分割字符为空时,默认为‘’ 即每一个字符为一个元素进行截取加入到数组中)

    数组中元素的查找

    1.arr.indexOf('a');

    正序遍历arr,返回arr数组中 第一个遍历到 的 元素 ‘a’ 所在位置,如不存在则返回 -1;

    2.arr.lastIndexOf

    反序遍历arr,返回arr数组中 第一个遍历到 的 元素 ‘a’ 所在位置,如不存在则返回 -1;

    3.arr.includes('a');

    如果arr数组中存在 ‘a’ 返回 true,否则返回false;

    三.数组常见遍历方式

    1.for循环,while循环,do while循环,for of

    2.arr.every (返回值:true/false)

    对数组中的每一项运行给定函数,如果改函数对每一项返回true,则返回true,否则返回false。

    let arr = [2,3,1,4,5,7,6];
    let a = arr.every((curr,index) => {
    	return curr > 3
    })
    console.log(a); //arr中存在小于3的元素,并不是每一项都返回的ture,打印 false
    

    3.arr.some (返回值:true/false)

    对数组中的每一项运行给定函数,如果改函数有一项返回true,则返回true,全部返回false时返回false。

    let arr = [2,3,1,4,5,7,6];
    let a = arr.every((curr,index) => {
    	return curr > 3
    })
    console.log(a); //arr中存在大于3的元素,打印 true。
    

    4.arr.forEach

    对数组中每一项运行给定函数,无返回值。作用为逻辑处理。

    5.arr.filter

    返回一个满足条件的新数组,但新数组必是原数组的一个子集(新数组的所有元素都来源于原数组),filter 意思为筛选,也就是从原数组筛选出满足条件的元素组合形成的新数组。

    let target = [1,2,4,6,7,9].filter((curr,index) => {
               if(curr <=5 ){
                   return curr;
                }
           });
    console.log(target);      //[1,2,4]
    

    6.arr.map

    对数组的每一项运行给定函数,返回每次函数调用的结果(return 返回的值)组成的数组。

    let arr = [1,2,3,4,5];
    let a = arr.map((curr,index) => {
        return curr + 1;
    });
    console.log(a); // [2,3,4,5,6]
    

    7.arr.reduce

    对函数的每一项执行给定函数,返回一个被叠加到累加器的值,reduce执行完毕后 返回这个累加器

    let arr = [1,2,3,4,5];
    let a = arr.reduce((previous, current, index) => {  previous 为累加器,默认为 arr [0] ,从index 为 1开始叠加。
        return previous  + current;
    })
    console.log(a);  //15
    
    [x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4);  //reduce运算法则
    

    注意:every 、some、filter、map、forEach 中无法中途终止遍历,这几种方法都会将arr数组的每一个元素进行遍历,并执行运行函数。

    四.数组的反叙、排序

    1.arr.reverse ();

    改变原数组,将arr反序排列。

    2.arr.sort();

    改变原数组,将arr 递增排列 或 递减排列

    let arr = [1,4,2,5,3];
    arr.sort((a,b) => {
        return a - b;  //递增排列
        //return b - a; 递减排列
    });
    console.log(arr);  // [1,2,3,4,5]
    

    自定义排序

    let friends = [
    {name:'zhangsan',sex:'man',age:20},
    {name:'lisi',sex:'man',age:29},
    {name:'wangwu',sex:'man',age:26}
    ];
    friends.sort((a,b) => {
    if(a.age < b.age){
        return -1;
    }
    if(a.age > b.age){
        return 1;
    }
    return 0;
    //可简化为 return a.age - b.age; 递增排序
                   //return b.age - a.age; 递减排序
    });
    console.log(friends);
    

    五.其它方法

    Array.from(arr);

    返回一个新的数组。可用于数组的深拷贝,也可以将类数组转化为数组。

    function sum () {
        let str = Array.from(arguments).join(',');
        //或者let str =  Array.prototype.join.call( arguments, ',' ); 
        console.log(str);
    }
    sum(1,2,3,4);  // 1,2,3,4
    //如果直接使用arguments.join(',')  系统会报错:arguments不是一个数组。实际上arguments为一个类数组,不拥有数组的一些方法。
    //我们操作dom节点时候,找到的节点集和也为一个类数组。
    //ES6 提供的Set 数据类型为一个类数组,可利用Array.from(set) 将Set类型转化为标准的数组;ps:也可利用Set的无重复性,先将数组转化为Set (new Set(arr)),再利用Array.from()  ,实现数组的去重。
    

    new Array(n).fill(0);

    新建一个n位数的数组,并用0进行填充。

    let a = new Array(3).fill(0);
    console.log(a);//[0,0,0]
    
  • 相关阅读:
    1230 jquery
    1221 监听事件
    1218 dom表格元素操作
    1216 DOM
    Java中对小数的向下取整,向上取整
    Mysql中 在SQL语句里进行日期格式转换
    一些常用格式化。价格、日期等 持续更新
    List对象里面根据某一字段去重
    java 后端 初始化图片像素(1980 x 1080)大小
    swagger里面测试List数据格式
  • 原文地址:https://www.cnblogs.com/honkerzh/p/10530098.html
Copyright © 2020-2023  润新知