Как объединить два массива объектов в один большой массив

Желание объединить два массива объектов. Массивы следующие:

let vehicle_data = [
  {
    "id": 1,
    "make_text": "Peugeot",
    "model_text": "307",
    "color_text": "Bleu",
    "category_text": "CT",
    "vin": "654321",
    "autralis_id": 0
  }
]

let vehicle_slot_data = [
  {
    "vehicle_id": 1,
    "zone": "T",
    "side": "B",
    "col": 2,
    "handled": 0,
    "uploaded": 0
  },
  {
    "vehicle_id": 1,
    "zone": "A",
    "side": "E",
    "col": 1,
    "handled": 0,
    "uploaded": 0
  }
]

Я хочу объединить эти два. Таким образом, результат, который я хочу получить:

let result = [
    {
        "id": 1,
        "make_text": "Peugeot",
        "model_text": "307",
        "color_text": "Bleu",
        "category_text": "CT",
        "vin": "654321",
        "autralis_id": 0,
        "vehicle_id": 1,
        "zone": "T",
        "side": "B",
        "col": 2,
        "handled": 0,
        "uploaded": 0
    },
    {
        "id": 1,
        "make_text": "Peugeot",
        "model_text": "307",
        "color_text": "Bleu",
        "category_text": "CT",
        "vin": "654321",
        "autralis_id": 0,
        "vehicle_id": 1,
        "zone": "A",
        "side": "E",
        "col": 1,
        "handled": 0,
        "uploaded": 0
    }
]

Я попытался сделать это следующим образом:

let result = [];

vehicle_data.map(i => {
  vehicle_slot_data.map(j => {
    if (j.vehicle_id === i.id && j.handled === 0){
      result.push(Object.assign(i, j));
    }
  })
});

Но с этим я получаю результат с двумя одинаковыми объектами:

let result = [
   {
      autralis_id: 0,
      category_text: "CT",
      col: 1,
      color_text: "Bleu",
      handled: 0,
      id: 1,
      make_text: "Peugeot",
      model_text: "307",
      side: "E",
      uploaded: 0,
      vehicle_id: 1,
      vin: "654321",
      zone: "A"
   },
   {
      autralis_id: 0,
      category_text: "CT",
      col: 1,
      color_text: "Bleu",
      handled: 0,
      id: 1,
      make_text: "Peugeot",
      model_text: "307",
      side: "E",
      uploaded: 0,
      vehicle_id: 1,
      vin: "654321",
      zone: "A"
   }
]

Вот скрипка.

Любой совет?

Источник

5 ответов

Решение

Вложенный цикл кажется более сложным, чем вам нужно. Кроме того, если вы используете .map() но не возвращая значение, значит, вы не используете его правильно и должны использовать .forEach() для простой итерации.

Во всяком случае, может быть что-то вроде этого:

let vehicle_data = [
  {
    "id": 1,
    "make_text": "Peugeot",
    "model_text": "307",
    "color_text": "Bleu",
    "category_text": "CT",
    "vin": "654321",
    "autralis_id": 0
  }
]

let vehicle_slot_data = [
  {
    "vehicle_id": 1,
    "zone": "T",
    "side": "B",
    "col": 2,
    "handled": 0,
    "uploaded": 0
  },
  {
    "vehicle_id": 1,
    "zone": "A",
    "side": "E",
    "col": 1,
    "handled": 0,
    "uploaded": 0
  }
]

let result = vehicle_slot_data
  .map(v => Object.assign({}, v, vehicle_data.find(m => m.id === v.vehicle_id)))

console.log(result)

Обратите внимание, что вы хотите иметь Object.assign() начать с нового пустого объекта и .find() возвращается undefined если нет соответствующего элемента.

РЕДАКТИРОВАТЬ: Я только что видел ваш комментарий о не включать элементы в результат, если они не совпадают (по идентификатору) в обоих массивах). Разверните следующее для способа сделать это:

let vehicle_data = [
  {
    "id": 1,
    "make_text": "Peugeot",
    "model_text": "307",
    "color_text": "Bleu",
    "category_text": "CT",
    "vin": "654321",
    "autralis_id": 0
  }
]

let vehicle_slot_data = [
  {
    "vehicle_id": 1,
    "zone": "T",
    "side": "B",
    "col": 2,
    "handled": 0,
    "uploaded": 0
  },
  {
    "vehicle_id": 2,
    "zone": "A",
    "side": "E",
    "col": 1,
    "handled": 0,
    "uploaded": 0
  }
]

let result = []
vehicle_slot_data.forEach(v => {
  var match = vehicle_data.find(m => m.id === v.vehicle_id)
  if (match)
    result.push(Object.assign({}, v, match))
})
console.log(result)

Источник 

let vehicle_data = [
  {
    "id": 1,
    "make_text": "Peugeot",
    "model_text": "307",
    "color_text": "Bleu",
    "category_text": "CT",
    "vin": "654321",
    "autralis_id": 0
  }
]

let vehicle_slot_data = [
  {
    "vehicle_id": 1,
    "zone": "T",
    "side": "B",
    "col": 2,
    "handled": 0,
    "uploaded": 0
  },
  {
    "vehicle_id": 1,
    "zone": "A",
    "side": "E",
    "col": 1,
    "handled": 0,
    "uploaded": 0
  }
]

let result = [];

vehicle_slot_data.map(i => {
      vehicle_data.map(j => {
        if (j.vehicle_id === i.id && i.handled === 0){
          result.push(Object.assign(i, j));
        }
      })
    });

console.log(result)
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/1.2.1/lodash.min.js"></script>

Просто поменяйте местами карты:

  vehicle_slot_data.map(i => {
      vehicle_data.map(j => {
        if (j.vehicle_id === i.id && i.handled === 0){
          result.push(Object.assign(i, j));
        }
      })
    });
Источник

Вам нужно использовать пустой объект в качестве исходного объекта.

result.push(Object.assign({}, i, j));
//                        ^^

Для лучшей производительности я предлагаю использовать Map и собрать все данные автомобиля на карте и использовать Array#map для данных слота.

let vehicle_data = [{ id: 1, make_text: "Peugeot", model_text: "307", color_text: "Bleu", category_text: "CT", vin: "654321", autralis_id: 0 }],
    vehicle_slot_data = [{ vehicle_id: 1, zone: "T", side: "B", col: 2, handled: 0, uploaded: 0 }, { vehicle_id: 1, zone: "A", side: "E", col: 1, handled: 0, uploaded: 0 }],
    vehicleMap = new Map(vehicle_data.map(v => [v.id, v])),
    result = vehicle_slot_data.map(v => Object.assign({}, vehicleMap.get(v.vehicle_id), v));

console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Источник

Кажется, вы хотите слить vehicle_slot_data[0] с vehicle_data[0],vehicle_slot_data[1] с vehicle_data[0] Посоветую использовать jquery extend метод, или вы можете написать функцию, чтобы сделать ту же работу

var result=[
            $.extend({},vehicle_slot_data[0],vehicle_data[0]),
            $.extend({},vehicle_slot_data[1],vehicle_data[0])
           ]
Источник

Вы пробовали "конкат"?

function myFunction() {
    var hege = [{
    "id": 1,
    "make_text": "Peugeot",
    "model_text": "307",
    "color_text": "Bleu",
    "category_text": "CT",
    "vin": "654321",
    "autralis_id": 0
  }];
    var stale = [{
    "vehicle_id": 1,
    "zone": "T",
    "side": "B",
    "col": 2,
    "handled": 0,
    "uploaded": 0
  },
  {
    "vehicle_id": 1,
    "zone": "A",
    "side": "E",
    "col": 1,
    "handled": 0,
    "uploaded": 0
  }];
    var children = hege.concat(stale); 
    document.getElementById("demo").innerHTML = JSON.stringify(children);
}
<!DOCTYPE html>
<html>
<body>

<p>Click the button to join two arrays.</p>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

</body>
</html>

Я надеюсь, что это поможет вам!

Источник
Другие вопросы по тегам