Is there a more efficient and elegant way to deal with the data in the array?

let dataSource = [];
menuList.map((item, index) =>
      dataSource.push({
        key: item.type,
        rank: index + 1,
        text: item.text,
        type: item.type,
        icon: item.icon,
        status: item.status
      })
    );

if you want to get the processed data, return a new array dataSource, which is the basic way to write it. Is there any other way?


let dataSource = menuList.map((item, index) => {
      item = {
        key: item.type,
        rank: index + 1,
        text: item.text,
        type: item.type,
        icon: item.icon,
        status: item.status
      };
      return item
    });

map originally describes the mapping relationship, so there is no need to create a new dataSource, to directly return the mapped object in the callback function of map. In this way, map will return a new array after traversing the array, which is a good way to write it.

in addition, if there are many mappings, several map methods may be called chained, for example:

arr.map(func1).map(func2).map(func3)

in this case, compose can be used to improve some efficiency, as follows:

arr.map(compose(func3, func2, func1))

    let dataSource = menuList.map((item, index) => {
        item.key = item.type + 1;
        item.rank = index + 1;
        ...
        return item;
    });
Menu