pro-react-redux icon indicating copy to clipboard operation
pro-react-redux copied to clipboard

Non-declarative state update

Open welf opened this issue 6 years ago • 3 comments

Здесь вы почему-то отказываетесь от декларативного подхода в пользу императивного:

onDelete = (id) => {
    this.setState((state) => {
      const idx = state.items.findIndex((item) => item.id === id);
      const items = [
        ...state.items.slice(0, idx),
        ...state.items.slice(idx + 1)
      ];
      return { items };
    });
  };

Почему бы этот код не написать вот так, в одну строчку?

deleteItem = id => {
    this.setState(({ todoData }) => ({todoData: todoData.filter(el => el.id !== id)}));
  };

Функция filter возвращает новый массив, поэтому изначальный массив не изменяется.

То же самое и в этом коде:

toggleProperty = (arr, id, propName) => {
    const idx = arr.findIndex((item) => item.id === id);
    const oldItem = arr[idx];
    const value = !oldItem[propName];

    const item = { ...arr[idx], [propName]: value } ;
    return [
      ...arr.slice(0, idx),
      item,
      ...arr.slice(idx + 1)
    ];
  };

Вместо того, чтобы мучаться с нахождением индекса нужного элемента, а затем со сборкой/разборкой массива, лучше всё сделать при помощи одного прохода по массиву с использованием map:

toggleProperty = (arr, id, propName) => {
    // определяем вспомогательную функцию
    const inverseProp = (item, id, propName) => {
      item.id === id ? return { ...item, [propName]: !item[propName] : return item
    };

    // и при помощи map возвращаем новый массив
    return arr.map(el => inverseProp(el, el.id, propName));
  };

welf avatar Jan 04 '19 19:01 welf

Add me on the Telegram ASAP! @JadaWilf

JadaWilf avatar Jan 28 '19 10:01 JadaWilf

У JadaWilf синтаксическая ошибка в выражении item.id === id ? return { ...item, [propName]: !item[propName] : return item //можно сократить в одну строку: let toggleProperty = (arr, id, propName) => arr.map(el => el.id === id ? { ...el, [propName]: !el[propName] } : el);

Kobdik avatar Jan 28 '19 13:01 Kobdik

@welf - метод filter - как по мне, лучший способ удалить что-то из массива именно про него говорится в в лучших туториалах и книгах.... но автор показал нам другой способ, - сказав, что мы сами можем написать код чуть лучше (или чуть хуже)

Manimall avatar Aug 03 '19 22:08 Manimall