Как изменить записи массива объектов с другим массивом - PullRequest
0 голосов
/ 13 апреля 2020

Я довольно новичок в JS, поэтому извините, если вопрос слишком сложный и, возможно, дубликат, но эта проблема беспокоила меня довольно долго, и я не мог найти удовлетворительный ответ или решение.

У меня есть массив объектов, где я хочу изменить некоторые свойства на основе другого массива такой же длины. Я думал, что это будет легко сделать за 1025 *, но, к моему удивлению, все свойства имеют одинаковое значение.

Вот массив объектов (dattmp) и другой массив (color):

var testdat = {
    Element1: {time: [1586777601886.39, 1586777608597.8, 1586777615309.21]},
    Element2: {time: [1586777603886.39, 1586777638597.8, 1586777315309.21]}
}
var options = {pathOptions: {className: "myclass"}}

var dattmp = [];
for (kys in testdat) {
    var tmp = {
      type: "Feature",
      properties: {
          time: testdat[kys].time,
          path_options: options.pathOptions
      }
    };
    dattmp.push(tmp);
}

var color = ["orange", "blue"];

Моя цель - включить цвет в dattmp, чтобы первый цвет объектов оранжевый, а второй синий.

Я пробовал обычные for-loop и map, но оба свойства цвета в итоге оказались blue.

for (var i = 0; i < color.length; i++) {
    dattmp[i].properties.path_options.color = color[i];
}

const newdat = dattmp.map((dt, i)  => {
    dt.properties.path_options.color = color[i];
    return dt;
});

Следующее будет работать, но моя IDE говорит мне, что с этим кодом много проблем, и я не совсем понимаю нотацию .... Итак, мой вопрос: Каков правильный подход к изменению значений по отдельности?

const newdat1 = dattmp.map((dt, i)  => {
    dt = { ...dt, properties: {...dt.properties, path_options: {...dt.properties.path_options, color: color[i]}}};
    return dt;
});

Ответы [ 2 ]

1 голос
/ 13 апреля 2020

Проблема options.pathOptions относится к одному и тому же объекту в обоих элементах массива. Так как это просто ссылка, его модификация изменяет все элементы массива. Чтобы скопировать, попробуйте Object.assign

var testdat = {
  Element1: { time: [1586777601886.39, 1586777608597.8, 1586777615309.21] },
  Element2: { time: [1586777603886.39, 1586777638597.8, 1586777315309.21] },
};
var options = { pathOptions: { className: 'myclass' } };

var dattmp = [];
for (kys in testdat) {
  var tmp = {
    type: 'Feature',
    properties: {
      time: testdat[kys].time,
      path_options: Object.assign({}, options.pathOptions),
    },
  };
  dattmp.push(tmp);
}
var color = ['orange', 'blue'];

for (var i = 0; i < color.length; i++) {
  dattmp[i].properties.path_options.color = color[i];
}
console.log(dattmp);
1 голос
/ 13 апреля 2020

Отметьте это:

const dattmp = [];


const color = ["orange", "blue"];

for (let i = 0; i < color.length; i += 1) {
  const obj = {
    properties: {
      path_options: {
        color: color[i],
      },
    },
  };
  dattmp.push(obj);
}

Проблема в том, что вы пытаетесь прочитать свойства из пустого массива.

Редактировать: Если вы хотите сохранить другие свойства, вы можете использовать это:

const newdat1 = dattmp.map((dt, i) => {
  const obj = {
    ...dt,
    properties: {
      ...dt.properties,
      path_options: { ...dt.properties.path_options, color: color[i] },
    },
  };
  return obj;
});
...