代码之家 › 专栏 › 技术社区 › arunmmanoharan

通过比较两个数组来映射基于索引的键

arrays javascript

arunmmanoharan · 技术社区 · 6 年前

const headers = ['Cars', 'Fruits', 'Food'];

const data = [{
    group: 'Cars',
    name: 'BMW',
    value: '25641'
  }, {
    group: 'Fruits',
    name: 'Apple',
    value: '45876'
  },
  {
    group: 'Cars',
    name: 'Benz',
    value: '65784'
  },
  {
    group: 'Cars',
    name: 'Toyota',
    value: '254'
  },
  {
    group: 'Food',
    name: 'Pizza',
    value: '87535'
  },
  {
    group: 'Cars',
    name: 'Honda',
    value: '65796'
  },
  {
    group: 'Fruits',
    name: 'Banana',
    value: '98631'
  },
  {
    group: 'Fruits',
    name: 'Orange',
    value: '87563'
  },
  {
    group: 'Food',
    name: 'Burger',
    value: '78324'
  },
  {
    group: 'Fruits',
    name: 'Mango',
    value: '24598'
  }
]

我需要对它们进行映射以获得这样的结果:

const newArray = [{
    id: '11',
    parent: '01',
    name: 'BMW',
    value: '25641'
  }, {
    id: '21',
    parentId: '02',
    name: 'Apple',
    value: '45876'
  },
  {
    id: '12',
    parentId: '01',
    name: 'Benz',
    value: '65784'
  },
  {
    id: '13',
    parentId: '01'
    name: 'Toyota',
    value: '254'
  },
  {
    id: '31',
    parentId: '03',
    name: 'Pizza',
    value: '87535'
  },
  {
    id: '14',
    parentId: '01',
    name: 'Honda',
    value: '65796'
  },
  {
    id: '22',
    parentId: '02',
    name: 'Banana',
    value: '98631'
  },
  {
    id: '23',
    parentId: '02',
    name: 'Orange',
    value: '87563'
  },
  {
    id: '32',
    parentId: '03',
    name: 'Burger',
    value: '78324'
  },
  {
    id: '24',
    parentId: '02',
    name: 'Mango',
    value: '24598'
  }
]

const headers = ['Cars', 'Fruits', 'Food'];

const data = [{
    group: 'Cars',
    name: 'BMW',
    value: '25641'
  }, {
    group: 'Fruits',
    name: 'Apple',
    value: '45876'
  },
  {
    group: 'Cars',
    name: 'Benz',
    value: '65784'
  },
  {
    group: 'Cars',
    name: 'Toyota',
    value: '254'
  },
  {
    group: 'Food',
    name: 'Pizza',
    value: '87535'
  },
  {
    group: 'Cars',
    name: 'Honda',
    value: '65796'
  },
  {
    group: 'Fruits',
    name: 'Banana',
    value: '98631'
  },
  {
    group: 'Fruits',
    name: 'Orange',
    value: '87563'
  },
  {
    group: 'Food',
    name: 'Burger',
    value: '78324'
  },
  {
    group: 'Fruits',
    name: 'Mango',
    value: '24598'
  }
]

const chart2ndLayer = _.map(data, (itemB, indexB) => {
  const parentIndex = headers.indexOf(itemB.group);
  return {
    id: `${parentIndex + 1}${indexB + 1}`,
    parent: `0${parentIndex + 1}`,
    value: parseInt(itemB.value, 10),
    name: itemB.name
  };
});

console.log(chart2ndLayer)

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>

id是按顺序排列的,但我要按索引排列。请给我建议。

2 回复 | 直到 6 年前

shuk 6 年前

const headers = ['Cars', 'Fruits', 'Food'];

const data = [{
    group: 'Cars',
    name: 'BMW',
    value: '25641'
  }, {
    group: 'Fruits',
    name: 'Apple',
    value: '45876'
  },
  {
    group: 'Cars',
    name: 'Benz',
    value: '65784'
  },
  {
    group: 'Cars',
    name: 'Toyota',
    value: '254'
  },
  {
    group: 'Food',
    name: 'Pizza',
    value: '87535'
  },
  {
    group: 'Cars',
    name: 'Honda',
    value: '65796'
  },
  {
    group: 'Fruits',
    name: 'Banana',
    value: '98631'
  },
  {
    group: 'Fruits',
    name: 'Orange',
    value: '87563'
  },
  {
    group: 'Food',
    name: 'Burger',
    value: '78324'
  },
  {
    group: 'Fruits',
    name: 'Mango',
    value: '24598'
  }
]

const createNewArray = (data, headers) => {
  const GROUP_INDEX = {};
  return data.map((object) => {
    if (!GROUP_INDEX[object.group]) {
      GROUP_INDEX[object.group] = 0;
    }
    GROUP_INDEX[object.group]++;
    const parentIndex = headers.indexOf(object.group);
    return {
      id: `${parentIndex + 1}${GROUP_INDEX[object.group]}`,
      parent: `0${parentIndex + 1}`,
      value: parseInt(object.value, 10),
      name: object.name
    }
  })
}

/* const chart2ndLayer = _.map(data, (itemB, indexB) => {
  const parentIndex = headers.indexOf(itemB.group);
  return {
    id: `${parentIndex + 1}${indexB + 1}`,
    parent: `0${parentIndex + 1}`,
    value: parseInt(itemB.value, 10),
    name: itemB.name
  };
});

console.log(chart2ndLayer) 
*/
console.log(createNewArray(data, headers));

利用相关度保持索引的hashmap方法

rc_dz 6 年前

我认为你可以这样做(可能需要一些小的重构):

const n = (i) => i > 9 ? i : `0${i}`;

function joinArrays(headers, dataArray) {
    const _newArray = headers.map((h, i) => {
        dataArray
            .filter((item, index) => {
                return item.group === h;
            }).forEach(item => {
                item.parent = n(i);
            });

        return h;
    });

    return newArray;
}

joinArrays(headers, data);