JSFiddle - React, Tailwind, and code Playground

JavaScript

const raw = [{
  "device_info": {
    "device_id": 123,
    "name": "iphone",
  },
  "age_data": [{
    "age_range": "0-10",
    "total_count": 15,
    "man": 6,
    "women": 9
  }, {
    "age_range": "11-20",
    "total_count": 11,
    "man": 7,
    "women": 4
  }]
}, {
  "device_info": {
    "device_id": 456,
    "name": "android",
  },
  "age_data": [{
    "age_range": "0-10",
    "total_count": 1,
    "man": 1,
    "women": 0
  }, {
    "age_range": "11-20",
    "total_count": 2,
    "man": 0,
    "women": 2
  }]
}]

const age_group = raw[0].age_data.map(obj => ({
  age_group: obj.age_range
}))

const cams = raw.map(obj => ({
  device_id: obj.device_info.device_id,
  device_name: obj.device_info.name
}))

console.log(cams)

const age_group_with_cams = age_group.map(obj =>
  Object.assign({}, obj, ...cams)
)

console.log(age_group_with_cams)


//expected
const data = [{
  age_group: '0-20',
  iphone: 26,
  android: 110
}, {
  age_group: '21-30',
  iphone: 0,
  android: 0
}, ];