js中map的使用

问题：如果在工作中后端返回对象的键名需要改变，我们应该怎么做呢？

回答：可以使用map

1. 一层对象

例

let arr = [
    {
        name: "李健",
        id: 4
    },
    {
        name: "王强",
        id: 5
    },
    {
        name: "张磊",
        id: 6
    },
]
arr2 = arr.map(item => {
    return { label: item.name, value: item.id }
})
console.log(arr2);

向上面例子，当我们需要label、value时就可以这么做了。 利用map直接return，利用forEach也可以做到，不过代码写得比这多。

2. 多层对象

多层对象我遇到的一个印象深刻的就是全国的省市县/区的列表了，下面看这个例子。

例

let cityList = [    {        childrenList: [{ id: 211, name: "福州", provinceName: "福建省" }, { id: 212, name: "厦门", provinceName: "福建省" }],
        provinceName: "福建省"
    },
    {
        childrenList: [{ id: 253, name: "拉萨", provinceName: "西藏自治区" }],
        provinceName: "西藏自治区"
    },
    {
        childrenList: [{ id: 222, name: "上海", provinceName: "上海市" }],
        provinceName: "上海市"
    }
]

首先这个数组中包含了多个对象，而在对象中有provinceName和childrenList两个属性名，childrenList又是一个数组包含了多个对象，这个时候childrenList的结构 像不像cityList呢？而cityList的结构又像不像例子一的一层对象呢？

像上面我们如果需要把provinceName转为label，id转为value，name转为label，就需要多层map了，

let cityList2 = cityList.map(items => {
        childrenList = items.childrenList.map(item => {
            return { value: item.id, label: item.name }
        })
        return { label: items.provinceName, childrenList }

    })
    console.log(cityList2);

注意：cityList2的结构一定要和cityList的结构一模一样，首先是一个数组结构，其次，在第二次map时，childrenList里面是对象，所以{value: item.id, label: item.name}要使用对象形式。