js将数组中对象摘出来,转成一个新的对象
时间: 2024-02-11 22:07:14 浏览: 28
可以使用 JavaScript 中的 reduce 方法来实现。假设有一个数组 arr,每个元素都是对象,我们要将其中的特定属性提取出来,组成一个新的对象。可以按照以下方式实现:
```javascript
const arr = [
{ name: 'Alice', age: 20 },
{ name: 'Bob', age: 25 },
{ name: 'Charlie', age: 30 }
];
const result = arr.reduce((prev, current) => {
prev[current.name] = current.age;
return prev;
}, {});
console.log(result); // {Alice: 20, Bob: 25, Charlie: 30}
```
在上面的代码中,reduce 方法将数组 arr 中的每个元素都执行一次回调函数,该函数接收两个参数:累加器 prev 和当前元素 current。回调函数中将当前元素中的 name 属性作为 key,age 属性作为 value,存储到累加器 prev 中。最终返回累加器 prev,得到一个新的对象。
相关问题
vue将大对象转成数组并且数组里对象有对象名称
可以使用Object.keys()方法将大对象的key值转成数组,然后使用map()方法循环遍历每一个key值,再使用Object.assign()方法将每个key对应的value值转成一个新的对象并将之前的key值作为对象的属性名称,最后将每个新的对象push到一个空数组中即可。示例代码如下:
```javascript
let obj = {
a: { name: "Tom", age: 18 },
b: { name: "Jerry", age: 20 }
}
let arr = Object.keys(obj).map(key => {
let newObj = Object.assign({ [key]: obj[key] })
return newObj
})
console.log(arr)
// output: [{a: {name: "Tom", age: 18}}, {b: {name: "Jerry", age: 20}}]
```
需要注意的是,在使用Object.assign()方法将每个value值转成新的对象时,需要使用ES6的对象属性名称语法([key])来定义新对象的属性名称。
将查询结果中的每一项通过 map() 方法进行遍历,将每一项转换成一个包含 value 和 label 两个属性的对象,并将所有转换后的对象存储在一个数组中。
假设查询结果存储在一个数组 `queryResult` 中,可以使用如下代码将每一项转换成一个包含 `value` 和 `label` 两个属性的对象,并将所有转换后的对象存储在一个数组 `resultArray` 中:
```javascript
const resultArray = queryResult.map(item => {
return {value: item.id, label: item.name};
});
```
在上述代码中,`map()` 方法用于遍历 `queryResult` 数组中的每一项。对于每一项,使用对象字面量语法创建一个包含 `value` 和 `label` 两个属性的对象,并将对应的属性值赋为该项的 `id` 和 `name` 属性值。最终将所有转换后的对象存储在一个数组 `resultArray` 中并返回。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)