Объедините два данных JSON в один с определенными значениями ключей

Question

У меня есть два файла CSV:

balldata.json

    [
      {
        "id": "1",
        "color": "red",

      },
      {
        "id": "2",
        "color": "blue",
      }]

court.json:

    [
      {
        "court_id": 2001,
        "ball_in_use": "1",
      },
      {
        "court_id": 2005,
        "ball_in_use": "2",
      }]

Как я могу отобразить цвет мяча на основе идентификатора площадки? Например: 2001 -> красный, 2005 -> синий.

Я пробовал подход ниже

    const App = (props) =>{
        let color = balldata.map((c, index) => {
          return c.id + "-" + c.color;})
        let game = courtdata.map((ball, index) => {
          return ball.ball_in_use;})
        return(
          //not sure what to return here since I am unable to use {color} or {game}
    )}

Answer 1

Вы можете сделать это, как показано ниже

const result = [courtdata, balldata].reduce((p, q) => p.map((c, i) => Object.assign({}, c, {color: q[i].color})));

// Result

[ 
 {court_id: 2001, ball_in_use: "1", color: "red"},
 {court_id: 2005, ball_in_use: "2", color: "blue"}
]

иначе используйте ниже

const result = [courtdata, balldata].reduce((p, q) => p.map((c, i) => Object.assign({}, {[c.court_id] : q[i].color})))

//Result

[
 {2001: "red"}, 
 {2005: "blue"}
]

Рабочий пример https://codesandbox.io/s/react-example-b7bfm