【问题标题】:how do i create a new object based off an array and another object?如何创建基于数组和另一个对象的新对象?
【发布时间】:2020-06-27 01:59:12
【问题描述】:

我正在尝试基于现有数组创建一个新对象。我想创建一个显示在下面的新对象

{ jack: 'jack', content: 'ocean'},
{ marie: 'marie', content: 'pond'},
{ james: 'james', content: 'fish biscuit'},
{paul: 'paul', content: 'cake'}

const words = ['jack','marie','james','paul']

const myUsers = [
    { name: 'jack', likes: 'ocean' },
    { name: 'marie', likes: 'pond' },
    { name: 'james', likes: 'fish biscuits' },
    { name: 'paul', likes: 'cake' }
]

const usersByLikes = words.map(word => {
    const container = {};
    

    container[word] = myUsers.map(user => user.name);
    container.content = myUsers[0].likes;

    return container;
})

我没有得到正确的对象,而是返回一个列表。

[ { jack: [ 'shark', 'turtle', 'otter' ], content: 'ocean'}, { marie: [ 'shark', 'turtle', 'otter' ], content: 'ocean' }, { james: [ 'shark', 'turtle', 'otter' ], content: 'ocean' }, { paul: [ 'shark', 'turtle', 'otter' ], content: 'ocean'} ]

【问题讨论】:

  • { jack: 'jack', content: 'ocean'}, { marie: 'marie', content: 'pond'}, { james: 'james', content: 'fish biscuit'}, {paul: 'paul', content: 'cake'} 不是一个对象。您想将数组作为响应还是对象?所以如果你想得到一个数组,那就是 ` [ { jack: 'jack', content: 'ocean'}, ] `
  • 你描述的结果不是一个对象是一个数组或者多个对象。

标签: javascript arrays node.js reactjs object


【解决方案1】:

words数组的作用是什么?我认为下面的代码会起作用。

const result = myUsers.map(user => ({
[user.name]: user.name,
content:  user.likes
}));
console.log('result', result);

如果要过滤单词数组中的用户,那么下面的解决方案将适合您。

const result = myUsers.filter(user => {
if (words.includes(user.name)) {
return ({
  [user.name]: user.name,
  content:  user.likes
})
}
return false;
});

您可以通过一个循环来满足您的需求。

【讨论】:

  • 谢谢,这行得通。我从没想过要使用过滤器原型。
【解决方案2】:

@aravindan-venkatesan 给出的答案应该会给你想要的结果。不管重要的是要考虑:

当使用.map() 时,javascript 返回一个长度相同的数组,其中包含您在map() 中告诉它的任何转换。

如果你想创建一个全新的对象,你自己的构造。尝试使用.reduce()。这允许您设置输入变量,即:对象、数组或字符串。

然后循环,返回你想要的,而不是旧数组的映射版本。

更多详情请看这里:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce

【讨论】:

    猜你喜欢
    • 2019-09-29
    • 2018-03-10
    • 2021-11-23
    • 2020-05-02
    • 2021-03-30
    • 2011-07-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多