js 用下标获取map值_js map方法处理返回数据，获取指定数据简写方法

map方法处理返回数据，获取指定数据简写方法

前言

后端返回数据为数组列表时，通常比较全面，包含了很多不需要的数据，可以通过 map 方法处理返回数据，筛选出想要的数据

例如

// 返回数据

res = [{

id: 1,

age: 16,

gender: 0

}, {

id: 2,

age: 20,

gender: 1

}]

如果只想获取 res 每项中的 id 和 name

即为

// 处理后的数据

data = [{

id: 1,

}, {

id: 2,

}]

最简单的方法就是 for 循环遍历，本文不讲 for 循环，讲一下 map 的简单写法

进入正题

下面统一按照上述的 res 数据为例子

首先从 map 最简单的方式实现 data

const data = res.map(function(item) {

return {

id: item.id,

}

})

当然可以使用 ES6 箭头函数简化

const data = res.map(item => ({ id: item.id, name: item.name }))

注意：这里需要注意的是使用箭头函数返回一个对象时不能直接去写 {} ，要在对象后面加上括号 ({})，防止和函数后面的大括号冲突而报错

上面是正常的写法，利用 ES6 解构赋值，还可以简写为如下

骚操作来了

const data = res.map(({ id, name }) => ({ id, name }))

怎么样，是不是变得非常简洁，但是会有一部分人在这里懵逼了，不要着急，往下看

其实真正理解起来也不难，从上述简单的方式来看，箭头函数前面的参数 ({id, name}) 实际上是把 item 解构成了两个变量，其中这两个变量是 item 中存在的，即为 id, name ，然后后面是返回了一个对象，就可以用前面两个解构出来的变量了，由于 key 和 value 一样，所以写成了对象的简写方式

但是这种只适用于 key 值一样的情况，如果想换 data 的 key 值怎么办呢

例如想让处理后的 data 的 id 变为 code

// 处理后的数据

data = [{

code: 1,

}, {

code: 2,

}]

聪明的同学已经懂了，这个时候只需要操作后面返回的数据即可

即为

const data = res.map(({ id, name }) => ({ code: id, name }))

完结撒花

js 用下标获取map值_js map方法处理返回数据，获取指定数据简写方法相关推荐

R语言使用epiDisplay包的alpha函数计算dataframe数据中指定数据列之间的信度分析、克朗巴哈系数、、每剔除某一条目后系数的变化、alphaBest函数获取最高alpha值对应的项目集
R语言使用epiDisplay包的alpha函数计算dataframe数据中指定数据列之间的信度分析.克朗巴哈系数(Cronbach's α).标准化系数.每当剔除某一条目后系数的变化.使用alpha ...
js获取classname值_js获取和设置DIV元素class值的方法
web页面中,利用js动态的改变div元素的class属性的值,可以实现很多的动态效果.比如动态修改div元素的背景颜色,改变字体的颜色等等.这篇文章就来说一说,javascript 如何获取和设置d ...
java通过属性名获取属性值_java反射机制根据属性名获取属性值的操作
java反射机制根据属性名获取属性值的操作,属性,对象,反射,访问权限,还可以 java反射机制根据属性名获取属性值的操作易采站长站,站长之家为您整理了java反射机制根据属性名获取属性值的操作的相 ...
js获取classname值_js 如何获取class的元素
展开全部使用62616964757a686964616fe58685e5aeb931333366306437document.getElementsByClassName('class')获取标签, ...
js获取classname值_js如何获取DIV的 class值？
1.根据ID,用var div=document.getElementById('youdivid') 2.通过标签名来取得var div=document.getElementsByTagName( ...
java中全局变量注解_自定义注解,前端获取token值的时候，全局变量返回后端用注解注入，以便以其他业务层使用...
@Target(ElementType.PARAMETER)//@Target 说明了Annotation所修饰的对象范围,PARAMETER:用于描述参数 @Retention(RetentionP ...
aspx 获取html值,aspx解析之后的html代码获取
/// /// 获取解析之后的aspx页面html代码 /// /// /// public string GetHtmlData(string virtualPath) { StringWriter ...
jquery怎么根据id获取元素值
jquery怎么根据id获取元素值 10 神坑2012 | 浏览 10748 次我有更好的答案 2015-05-11 11:40 最佳答案获取什么值呢.$("#id")获 ...
python网络爬虫系列（七）——selenium的介绍 selenium定位获取标签对象并提取数据 selenium的其它使用方法
一.selenium的介绍知识点: 了解 selenium的工作原理了解 selenium以及chromedriver的安装掌握标签对象click点击以及send_keys输入 1. sele ...

js 用下标获取map值_js map方法处理返回数据，获取指定数据简写方法

js 用下标获取map值_js map方法处理返回数据，获取指定数据简写方法相关推荐

最新文章

热门文章