将带有嵌套对象的对象数组转换为简单的对象数组?

时间:2020-01-16 14:53:24

标签: javascript arrays javascript-objects nested-object

我给了一个嵌套对象数组,我想将其转换为简单的对象数组,但我不知道该问题的处理方法,有人可以建议我解决此问题的方法。我无法自己解决或找不到类似的东西

const data = [
  {
    attachment: {
      Name: {type: string, value: 'Amar'},
      'Second Contact': {type: 'phoneNumber', value: '+91123587900'},
      'First Contact': {type: 'phoneNumber', value: '+911234567890'},
      'Registered Office Address': {
        value: 'New Delhi',
        type: 'string',
      },
      'Company Logo': {type: 'string', value: ''},
      'Youtube ID': {type: 'string', value: ''},
    },
    creator: {
      displayName: 'xyz',
      phoneNumber: '+915453553554',
      photoURL:
        'https://www.google.com/url?sa=i&source=images&cd=&ved=2ahUKEwixw9uJrYjnAhWOe30KHa42AFwQjRx6BAgBEAQ&url=https%3A%2F%2Funsplash.com%2Fs%2Fphotos%2Fpic&psig=AOvVaw24C_LUOadGZAi3r2JtZe9b&ust=1579272070036146',
    },
  },
  {
    attachment: {
      Name: {type: string, value: 'hari'},
      'Second Contact': {type: 'phoneNumber', value: '+91153587900'},
      'First Contact': {type: 'phoneNumber', value: '+911264567890'},
      'Registered Office Address': {
        value: 'New Delhi mv',
        type: 'string',
      },
      'Company Logo': {type: 'string', value: ''},
      'Youtube ID': {type: 'string', value: ''},
    },
    creator: {
      displayName: 'xyz',
      phoneNumber: '+915453543554',
      photoURL:
        'https://www.google.com/url?sa=i&source=images&cd=&ved=2ahUKEwixw9uJrYjnAhWOe30KHa42AFwQjRx6BAgBEAQ&url=https%3A%2F%2Funsplash.com%2Fs%2Fphotos%2Fpic&psig=AOvVaw24C_LUOadGZAi3r2JtZe9b&ust=1579272070036146',
    },
  },
];

预期的输出是这样的

[
    {
        Name:'Amar',
        'Second Contact':+91123587900,
        'First Contact':+911234567890,
        'Registered Office Address':'New Delhi',
        displayName:'xyz',
        phoneNumber:'+915453553554'   
    },
    {
        Name:'hari',
        'Second Contact':+91153587900,
        'First Contact':+911264567890,
        'Registered Office Address':'New Delhi mv',
        displayName:'xyz',
        phoneNumber:'+915453543554'     
    }
]

2 个答案:

答案 0 :(得分:0)

假设您需要获得很少的属性。您可以简单地使用map。如果您需要一个适用于所有属性的解决方案,我可能会使用object.keys进行迭代。

我在这里添加了两种解决方案

const data = [
  {
    "attachment": {
      "Name": {"type": "string", "value": "Amar"},
      "Second Contact": {"type": "phoneNumber", "value": "+91123587900"},
      "First Contact": {"type": "phoneNumber", "value": "+911234567890"},
      "Registered Office Address": {
        "value": "New Delhi",
        "type": "string"
      },
      "Company Logo": {"type": "string", "value": ""},
      "Youtube ID": {"type": "string", "value": ""}
    },
    "creator": {
      "displayName": "xyz",
      "phoneNumber": "+915453553554",
      "photoURL":
        "https://www.google.com/url?sa=i&source=images&cd=&ved=2ahUKEwixw9uJrYjnAhWOe30KHa42AFwQjRx6BAgBEAQ&url=https%3A%2F%2Funsplash.com%2Fs%2Fphotos%2Fpic&psig=AOvVaw24C_LUOadGZAi3r2JtZe9b&ust=1579272070036146"
    }
  },
  {
    "attachment": {
      "Name": {"type": "string", "value": "hari"},
      "Second Contact": {"type": "phoneNumber", "value": "+91153587900"},
      "First Contact": {"type": "phoneNumber", "value": "+911264567890"},
      "Registered Office Address": {
        "value": "New Delhi mv",
        "type": "string"
      },
      "Company Logo": {"type": "string", "value": ""},
      "Youtube ID": {"type": "string", "value": ""}
    },
    "creator": {
      "displayName": "xyz",
      "phoneNumber": "+915453543554",
      "photoURL":
        "https://www.google.com/url?sa=i&source=images&cd=&ved=2ahUKEwixw9uJrYjnAhWOe30KHa42AFwQjRx6BAgBEAQ&url=https%3A%2F%2Funsplash.com%2Fs%2Fphotos%2Fpic&psig=AOvVaw24C_LUOadGZAi3r2JtZe9b&ust=1579272070036146"
    }
  }
];

const result = data.map(item => {
  return {
    "Name": item.attachment.Name.value,
    "Second Contact": item.attachment["Second Contact"].value
  };
});

console.log(JSON.stringify(result));


// Another generic way
const result2 = data.map(item => {
  const singleObj = {};
  Object.keys(item.attachment).forEach(key => {
singleObj[key] = item.attachment[key].value;
  });
  return singleObj;
});

console.log(JSON.stringify(result2));

答案 1 :(得分:0)

请确保您对javascript有所了解,这很容易解决。唯一棘手的部分可能是带有“第二联系人”之类的空格的字段。

解决此特殊情况的方法如下:

const output = data.map(item => {
    return {
        name: item.attachment.Name.value,
        'Second Contact': item.attachment['Second Contact'].value,
        'First Contact': item.attachment['First Contact'].value,
        'Registered Office Address':item.attachment['Registered Office Address'].value,
        displayName: item.creator.displayName,
        phoneNumber: item.creator.phoneNumber 
    };
})

console.log(output);

提琴https://jsfiddle.net/chgnu1d5/

相关问题