map方法数据映射

很多时候我们需要对后端的数据做一些处理，比如后端返回数据某个字段为guarantee: ['S1', 'S3']，而在前端页面展示为“信用，质押”，后端设定的数据['S1', 'S2', 'S3', 'S4', 'S5']，分别对应前端展示字段“信用，抵押，质押，保险，担保”，这个时候，我们可以用到非常强大的map方法：

let arr1 = ['S1', 'S3']
let options = {
    S1: '信用',
    S2: '抵押',
    S3: '质押',
    S4: '保险',
    S5: '担保'
}    
arr1 = arr1.map(item => {
    return options[item]
})
console.log(arr1)

控制台输出：

map还可以轻松改变对象的键值与值，看下面代码：

let arr = [
    {title: '标题1',read:10,hot: false},
    {title: '标题2',read:101,hot: true},
    {title: '标题2',read:30,hot: true}
];
let newArr = arr.map((item,index,arr)=>{
    let json = {};
    json.title=`标题：${item.title}`;
    json.read=item.read;
    json.status=item.hot==true&&'666!';
    return json;
})
console.log(newArr)

控制台输出：

我们看到，经过处理的数据title的值发生改变，而hot变成status, 值也同样发生改变，这在与后台做数据交互是非常实用。

简述一下map方法的参数：

item: 必须。当前元素的值；

index: 可选。当前元素的索引值；

arr: 可选。当前元素属于的数组对象。

总之，map方法做数据映射非常方便强大，共勉！