Присвоение объекта объекту JS вызывает дублирование объектов

Question

Присвоение объекта объекту JS вызывает дублирование объектов

1

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

{
  Foo: {
    firstname: "sally",
    lastname: "jenkins"
  },
  Bar: {
    firstname: "john",
    lastname: "smith"
  }
}

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

let formInfo = {}
let spriteAndId = {}
forms.forEach((form) => {
  spriteAndId["id"] = parseInt(form.pokemon.url.substr(form.pokemon.url.length - 6), 10);
  spriteAndId["url"] = spriteUrlGen(spriteAndId["id"]);
  formInfo[form.pokemon.name] = spriteAndId;
})

Я прошу прощения, если это трудно понять, но все, что он делает, это присвоить URL-адрес (https://example.com) и id (1234) для пустого объекта spriteAndId. Переменные формы - это массив с уже имеющимися данными.

Если я запишу spriteAndId в цикле, я получаю правильный вывод с новыми значениями на каждой итерации, но, похоже, он просто присваивает только один из этих итераций каждому элементу родительского объекта.

Я подумал, что, может быть, я не понял forEach достаточно хорошо, поэтому я реализовал его с помощью цикла for и получил тот же результат. Я не могу окутать голову, почему он присваивает один и тот же объект всем значениям formInfo.

Надеюсь, кто-то может пролить свет на то, что мне здесь не хватает. Заранее спасибо!

Danny Canter 16 июль 2018, в 19:37

Источник

1

Значения объекта являются ссылками на объект. Назначение не делает копию. Переместите инициализацию spriteAndId внутрь цикла.
Pointy 16 июль 2018, в 17:00
0

@Pointy Имеет ли это какие-либо ограничения производительности, поскольку я назначаю новое значение для каждой итерации цикла? Временами в массиве около 400 предметов. И спасибо вам большое! Сейчас опробую
Danny Canter 16 июль 2018, в 17:04
0

Нет; думать о том, что производительность будет, если назначая ссылки на объекты на самом деле делали копию.
Pointy 16 июль 2018, в 17:06
0

@Pointy Еще раз большое спасибо, что действительно сделал это, и вы так много прояснили. Береги себя
Danny Canter 16 июль 2018, в 17:15

Показать ещё 2 комментария

Теги:

javascript

object

arrays

1 ответ

Ещё вопросы

Значения объекта являются ссылками на объект. Назначение не делает копию. Переместите инициализацию spriteAndId внутрь цикла.
@Pointy Имеет ли это какие-либо ограничения производительности, поскольку я назначаю новое значение для каждой итерации цикла? Временами в массиве около 400 предметов. И спасибо вам большое! Сейчас опробую
Нет; думать о том, что производительность будет, если назначая ссылки на объекты на самом деле делали копию.
@Pointy Еще раз большое спасибо, что действительно сделал это, и вы так много прояснили. Береги себя

slyfox42 · Answer 1 · 2018-07-16T15-54-00.000Z

    const formInfo = Object.keys(form)
     .map(obj => ({
          [form[obj].name]: {
            id: form[obj].id,
            sprite: spriteUrlGen(form[obj].id)
           }
     }))
     .reduce((prev, curr) => ({ ...prev, curr }, {}))

Если я понял, что вы пытаетесь достичь, это конечный объект формы с именем покемона в качестве ключа и данных (спрайт и идентификатор) в качестве значения. Object.keys() возвращает массив всех свойств объекта. Вы можете отображать их и преобразовывать данные, в этом случае мы возвращаем объект с именем pokemon в качестве ключа и id, sprite в качестве значений. Обратите внимание на [] которые заключают в себе ключ объекта, что делает значение динамическим, иначе, если вы напишете hardcode, ключ не будет работать. Теперь все эти значения были отображены/преобразованы в объекты, функции сокращения принимают их все и заключают в один объект, начиная с {} пустого объекта

Вы на месте. Еще один способ делать вещи никогда не бывает плохим! Я мог бы использовать это для другого места с аналогичной проблемой. Спасибо!!