Обновить отдельный элемент в массиве объектов

Question

У меня есть некоторые данные - я хотел бы обновить логическое значение в одном объекте.

Работает ниже - просто кажется, что очень длинный способ сделать что-то настолько простое?

Также - если бы я изменил letter: "c", это было бы c в начале массива, что было бы неправильно. Так есть ли хороший способ поддерживать порядок?

Спасибо !!

// initial data
let data = [
  { letter: "a", number: 1, bool: true },
  { letter: "b", number: 2, bool: true },
  { letter: "c", number: 3, bool: true },
  { letter: "d", number: 4, bool: true },
  { letter: "e", number: 5, bool: true },
  { letter: "f", number: 6, bool: true },
  { letter: "g", number: 7, bool: true },
  { letter: "h", number: 8, bool: true },
  { letter: "i", number: 9, bool: true }
];

// get the row I need to change
const rowToChange = data.find(item => {
  return item.letter === "a";
});

// remove that row from data
data = data.filter(document => {
  return document !== rowToChange;
});

// updates the boolean value
rowToChange.bool = !rowToChange.bool;

// puts it back into the array
data = [rowToChange, ...data];

Answer 1

Метод, который вы используете, заключается в том, чтобы (обычно) убедиться, что вы не изменили исходные данные. Если изменение данных не является проблемой (и не похоже, что это так), вы можете просто удалить часть кода. Я использовал findIndex здесь вместо find:

let data = [
  { letter: "a", number: 1, bool: true },
  { letter: "b", number: 2, bool: true },
  { letter: "c", number: 3, bool: true },
  { letter: "d", number: 4, bool: true },
  { letter: "e", number: 5, bool: true },
  { letter: "f", number: 6, bool: true },
  { letter: "g", number: 7, bool: true },
  { letter: "h", number: 8, bool: true },
  { letter: "i", number: 9, bool: true }
];

const rowToChange = data.findIndex(item => {
  return item.letter === "c";
});

data[rowToChange].bool = !data[rowToChange].bool;

console.log(data);

Answer 2

С помощью ES6 вы можете легко обновить свойство одного объекта в вашем массиве, используя функцию map:

let data = [
  { letter: "a", number: 1, bool: true },
  { letter: "b", number: 2, bool: true },
  { letter: "c", number: 3, bool: true },
  { letter: "d", number: 4, bool: true },
  { letter: "e", number: 5, bool: true },
  { letter: "f", number: 6, bool: true },
  { letter: "g", number: 7, bool: true },
  { letter: "h", number: 8, bool: true },
  { letter: "i", number: 9, bool: true }
];

console.log(data.map(d =>
  d.letter === 'c'
    ? { ...d, bool: false }
    : d
));

Это приведет к следующему выводу:

[
  { letter: "a", number: 1, bool: true },
  { letter: "b", number: 2, bool: true },
  { letter: "c", number: 3, bool: false },
  { letter: "d", number: 4, bool: true },
  { letter: "e", number: 5, bool: true },
  { letter: "f", number: 6, bool: true },
  { letter: "g", number: 7, bool: true },
  { letter: "h", number: 8, bool: true },
  { letter: "i", number: 9, bool: true }
]

Answer 3

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

data.forEach(item => {
    if (item.letter == "a") {
       item.bool = !item.bool;
    }
});