There is a time array object, time is not continuous, how to complete better?

needs to show all the hours of the day. The data returned by the backend is as follows
beforData: [

]
  {
    "time_hours": "09", // 
    "approved_amount": 28068.0,
    "pass_rate": 1.0
  },
  {
    "time_hours":"10",
    "approved_amount":0.0,
    "pass_rate":0.0
  },
  {
    "time_hours":"11",
    "approved_amount":42706.0,
    "pass_rate":0.5
  },
  {
    "time_hours":"13",
    "approved_amount":0.0,
    "pass_rate":0.0
  },
  {
    "time_hours":"15",
    "approved_amount":37700.0,
    "pass_rate":0.5714285714
  },
  {
    "time_hours":"16",
    "approved_amount":0.0,
    "pass_rate":0.0
  },
  {
    "time_hours":"17",
    "approved_amount":29520.0,
    "pass_rate":0.6
  },
  {
    "time_hours":"18",
    "approved_amount":0.0,
    "pass_rate":0.0
  },{
    "time_hours":"19",
    "approved_amount":56216.0,
    "pass_rate":1.0
  },
  {
    "time_hours":"22",
    "approved_amount":5800.0,
    "pass_rate":1.0
  },
  {
    "time_hours":"23",
    "approved_amount":0.0,
    "pass_rate":0.0
  }
]

you need to convert the missing hours into
[

].
  {
    "time_hours": "01:00",
    "approved_amount": null,
    "pass_rate": null,
  },
  {
    "time_hours": "02:00",
    "approved_amount": null,
    "pass_rate": null,
  },
  {
    "time_hours": "03:00",
    "approved_amount": null,
    "pass_rate": null,
  },
  {
    "time_hours": "04:00",
    "approved_amount": null,
    "pass_rate": null,
  },
  {
    "time_hours": "05:00",
    "approved_amount": null,
    "pass_rate": null,
  },
  {
    "time_hours": "06:00",
    "approved_amount": null,
    "pass_rate": null,
  },
  {
    "time_hours": "07:00",
    "approved_amount": null,
    "pass_rate": null,
  },
  {
    "time_hours": "08:00",
    "approved_amount": null,
    "pass_rate": null,
  },
  {
    "time_hours": "09:00",
    "approved_amount": 28068.0,
    "pass_rate": 1.0
  },
  {
    "time_hours":"10:00",
    "approved_amount":0.0,
    "pass_rate":0.0
  },
  {
    "time_hours":"11:00",
    "approved_amount":42706.0,
    "pass_rate":0.5
  },
  {
    "time_hours": "12:00",
    "approved_amount": null,
    "pass_rate": null,
  },
  {
    "time_hours":"13:00",
    "approved_amount":0.0,
    "pass_rate":0.0
  },
  {
    "time_hours": "14:00",
    "approved_amount": null,
    "pass_rate": null,
  },
  {
    "time_hours":"15:00",
    "approved_amount":37700.0,
    "pass_rate":0.5714285714
  },
  {
    "time_hours":"16:00",
    "approved_amount":0.0,
    "pass_rate":0.0
  },
  {
    "time_hours":"17:00",
    "approved_amount":29520.0,
    "pass_rate":0.6
  },
  {
    "time_hours":"18:00",
    "approved_amount":0.0,
    "pass_rate":0.0
  },{
    "time_hours":"19:00",
    "approved_amount":56216.0,
    "pass_rate":1.0
  },
  {
    "time_hours": "20:00",
    "approved_amount": null,
    "pass_rate": null,
  },
  {
    "time_hours": "21:00",
    "approved_amount": null,
    "pass_rate": null,
  },
  {
    "time_hours":"22:00",
    "approved_amount":5800.0,
    "pass_rate":1.0
  },
  {
    "time_hours":"23:00",
    "approved_amount":0.0,
    "pass_rate":0.0
  },
  {
    "time_hours": "00:00",
    "approved_amount": null,
    "pass_rate": null,
  },
]
Mar.28,2021

add a linear time complexity

  let completeData = [{'time_hours': '01:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '02:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '03:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '04:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '05:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '06:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '07:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '08:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '09:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '10:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '11:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '12:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '13:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '14:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '15:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '16:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '17:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '18:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '19:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '20:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '21:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '22:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '23:00', 'approved_amount': null, 'pass_rate': null}, {'time_hours': '00:00', 'approved_amount': null, 'pass_rate': null}]
  let afterData = completeData.map(val => {
    let res = beforData.find(v => v.time_hours === val.time_hours.slice(0, 2))
    res ? res.time_hours = val.time_hours : res = val
    return res
  })
  console.log(afterData)

since the result is fixed, traverse it the other way around

Menu