zoukankan      html  css  js  c++  java
  • js根据相同属性值将一个一维对象数组转为二维数组


    将一个一维对象数组,根据相同的属性值,转化成一个二维数组 

    // 待转换的一维数组
    var arrayFirst = [{
        code: 1,
        datas: 'a网吧'
    },
    {
        code: 1,
        datas: 'b网吧'
    }, {
        code: 2,
        datas: 'a酒店'
    },
    {
        code: 2,
        datas: 'b酒店'
    },
    {
        code: 3,
        datas: 'a学校'
    }, {
        code: 3,
        datas: 'b学校'
    },
    {
        code: 3,
        datas: 'c学校'
    }
    ]
    

    按照相同的code值转换成二维数组

    // 转换后的二维数组
    [
    [{code: 1, datas: "a网吧"},{code: 1, datas: "b网吧"}],
    [{code: 2, datas: "a酒店"},{code: 2, datas: "b酒店"}], 
    [{code: 3, datas: "a学校"},{code: 3, datas: "b学校"},{code: 3, datas: "c学校"}]]
    

    es6的方法

    使用es6的方法
    Object.values() //返回 值 数组
    返回数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键值

    // 转换后的二维数组
    var arrayTwo = Object.values(arrayFirst.reduce((res, item) => {
      res[item.code] ? res[item.code].push(item) : res[item.code] = [item];
      return res;
    }, {}));
    console.log(arrayTwo)
    

    第二种方法

    // 转换后的二维数组
    function convert (arr) {
        var map1 = {};
        while(arr.length) {
            let current = arr.pop(); // 会影响原数组
            map1[current.code] = map1[current.code] || [];
            map1[current.code].push(current);
        }
        
        return Object.keys(map1).map(key => map1[key]);
    }
    var arrayTwo = convert(arrayFirst)
    console.log(arrayTwo)
    

    顺便介绍一下reduce 方法 :

    array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
    

    reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
    reduce() 对于空数组是不会执行回调函数的

    参数描述
    total 必需。初始值, 或者计算结束后的返回值。
    currentValue 必需。当前元素
    currentIndex 可选。当前元素的索引
    arr 可选。当前元素所属的数组对象
    initialValue 可选。传递给函数的初始值
     
     
     
     

  • 相关阅读:
    URAL 1948 H
    int、long、long long取值范围
    Bonetrousle HackerRank 数学 + 思维题
    湖南省第十二届大学生计算机程序设计竞赛 problem A 2016
    Abbreviation ---- hackerrank
    POJ 3321 Apple Tree DFS序 + 树状数组
    HDU
    PICO CTF 2013 PHP 2: 85
    XSS进阶三
    XSS进阶二
  • 原文地址:https://www.cnblogs.com/ygyy/p/14297432.html
Copyright © 2011-2022 走看看