Объединение объекта в массив без объединения JavaScript JS

#javascript #arrays #object #concatenation

Вопрос:

В настоящее время я борюсь с этой проблемой. Я просмотрел множество форумов и веб-сайтов и не получил ответа. Я хотел бы объединить два объекта в один массив без объединения с помощью этого конструктора объектов car, :

 const car = {
  year: '',
  model: '',
  mileage: '',
  available_colors: [1, 2, 3], // numbers indicate color id
};

var garage = [];

const honda = Object.create(car);
const volvo = Object.create(car);

honda.available_colors[1] = 34;
volvo.available_colors[0] = 80;
honda.year = 1987;
volvo.year = 1990;
garage.push(honda, volvo);

console.log(garage);

Проблема в том, что вот результат, который у меня есть :

     console.log(garage[0].available_colors,garage[1].available_colors);
    -->[80,2,3] , [80,2,3]
 
    console.log(garage[0].year, garage[1].year);
    -->1987 , 1990

Проблема не возникает для других параметров, только для массива. Как у меня могут быть два отдельных массива доступных цветов, которые принадлежат каждому объекту отдельно?

Ответ №1:

honda.available_colors и volvo.available_colors ссылаются на один и тот же Array объект.

Вместо этого вы можете создать новый массив для каждого автомобиля, используя копию slice d car.available_colors в качестве отправной точки для каждого:

 honda.available_colors = honda.available_colors.slice();
honda.available_colors[1]=34;
volvo.available_colors = volvo.available_colors.slice();
volvo.available_colors[0]=80;

Это создаст новый экземпляр массива для каждого экземпляра автомобиля, поэтому они не будут использовать один и тот же массив. Обратите внимание, что это означает, что будущие изменения значения прототипа car.available_colors не будут видны экземплярам после их создания: каждый экземпляр будет копировать состояние прототипа available_colors во время создания.

Ответ №2:

Вам нужно сделать неглубокую копию как car объекта, так и available_colors массива

Я использовал Object.assign и spread оператора

Вы можете прочитать о Object.assign и spread операторе здесь и здесь

 const car= {
    year:'',
    model:'',
    mileage:'',
    available_colors:[1,2,3], // numbers indicate color id
}

var garage =[];

const honda = Object.assign({}, car);
const volvo = Object.assign({}, car);

honda.available_colors = [...honda.available_colors];
honda.available_colors[1] = 34;
volvo.available_colors= [...volvo.available_colors];
volvo.available_colors[0] = 80;
honda.year = 1987;
volvo.year = 1990;
garage.push(honda, volvo);

console.log(garage);