javascript循环嵌套数组并根据另一个数组提取属性答案

【问题标题】：javascript loop nested array and extract properties based on another arrayjavascript循环嵌套数组并根据另一个数组提取属性
【发布时间】：2018-05-14 00:04:27
【问题描述】：

我有一个kids 对象，如下所示：

const kids = {
    name: 'john',
    extra: {
        city: 'London',
        hobbies: [
            {
                id: 'football',
                team: 'ABC',
            },
            {
                id: 'basketball',
                team: 'DEF',
            },
        ],
    },
};

我有以下对象，其中包含所有运动和额外信息。

const sports = [
    {
        name: 'volleyball',
        coach: 'tom',
    },
    {
        name: 'waterpolo',
        coach: 'jack',
    },
    {
        name: 'swimming',
        coach: 'kate',
    },
    {
        name: 'football',
        coach: 'sara',
    },
];

我想获取 hobbies 数组中所有 ids 的列表并遍历运动数组中的每个运动项目，并找到，为该对象添加一个额外的字段 available 并给出一个值true，以及其对应的团队名称，因此结果将如下所示：

const result = [
    {
        name: 'volleyball',
        coach: 'tom',
    },
    {
        name: 'waterpolo',
        coach: 'jack',
    },
    {
        name: 'swimming',
        coach: 'kate',
    },
    {
        name: 'football',
        coach: 'sara',
        available: true,   // it exists in kids' hobbies
        team: 'DEF'      // get it from kids' hobbies
    },
];

顺便说一下，这是我的尝试：

const result = kids.extra.hobbies.map(a => a.id);
for (var key in sports) {
    console.log(sports[key].name);
    const foundIndex = result.indexOf(sports[key].name);
    if ( foundIndex > -1) {
      sports[key].available = true;
    }
}
console.log(sports)

但这不包括团队。如何将其添加到上述代码中？

【问题讨论】：

标签： javascript arrays json ecmascript-6 mapreduce

【解决方案1】：

使用.find找到合适的爱好对象，如果存在则提取其team：

const kids = {name:'john',extra:{city:'London',hobbies:[{id:'football',team:'ABC',},{id:'basketball',team:'DEF',},],},}
const sports = [{name:'volleyball',coach:'tom',},{name:'waterpolo',coach:'jack',},{name:'swimming',coach:'kate',},{name:'football',coach:'sara',},];
const { hobbies } = kids.extra;
const result = sports.map((sportObj) => {
  const foundObj = hobbies.find(({ id }) => id === sportObj.name);
  if (!foundObj) return { ...sportObj };
  return {...sportObj, team: foundObj.team, available: true };
});
console.log(result);

没有传播：

const kids = {name:'john',extra:{city:'London',hobbies:[{id:'football',team:'ABC',},{id:'basketball',team:'DEF',},],},}
const sports = [{name:'volleyball',coach:'tom',},{name:'waterpolo',coach:'jack',},{name:'swimming',coach:'kate',},{name:'football',coach:'sara',},];
const { hobbies } = kids.extra;
const result = sports.map((sportObj) => {
  const foundObj = hobbies.find(({ id }) => id === sportObj.name);
  if (!foundObj) return Object.assign({}, sportObj);
  return Object.assign({}, sportObj, { team: foundObj.team, available: true });
});
console.log(result);

【讨论】：

【解决方案2】：

在您的代码中，result 数组和 kids.extra.hobbies 具有相同的数组索引（因为一个映射到另一个）。因此，您可以在爱好中使用foundIndex 查找爱好对象：

const result = kids.extra.hobbies.map(a => a.id);
for (var key in sports) {
    const foundIndex = result.indexOf(sports[key].name);
    if ( foundIndex > -1) {
      sports[key].available = true;
      // lookup hobby at `foundIndex`
      sports[key].team = kids.extra.hobbies[foundIndex].team;
    }
}
console.log(sports)

【讨论】：