Удалить функцию в Реакции с .filter

Question

При создании приложения Todo я хочу отфильтровать объект из моего массива с помощью функции удаления. До сих пор я получил это.

deleteTask(task) {

    let taskList = this.state.tasks;

    var newTask = taskList.filter(function(_task) { return _task != task})

    this.setState({ 
        tasks: newTask
    });

}

Единственная проблема в том, что функция возвращает весь массив при использовании функции. Таким образом, аргумент Task, который должен возвращать только объект из моего массива, возвращает весь массив, а в моем newTask var.

Как я могу связать или заставить эту функцию работать?

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

Answer 1

Оператор равенства в javascript сравнивает ссылки объекта. Таким образом, даже если оба объекта имеют одинаковое значение, так как они указывают на разные экземпляры, == всегда будет возвращать false. Итак, как я вижу, у вас есть два варианта:

1. Переформулируйте ваш код, чтобы включить часть id и какие то сравнивать две задачи.
2. Используйте некоторые библиотеки, такие как lodash или underscore для глубокого сравнения

Answer 2

Прежде всего, давайте посмотрим, почему _task != task не работает так, как вам нужно. Попробуйте это:

const a = { x: 10, y: 'hello' };
const b = { x: 10, y: 'hello' };
console.log(
  a==b,
  a===b,
  Object.is(a,b)
);

Удивительно, а? Прочитайте это для более подробной информации.

В любом случае, вы должны реорганизовать свой код, чтобы включить свойство id в свои задачи, чтобы можно было сравнивать две задачи с их идентификаторами - не нужно беспокоиться о странных реализациях сравнения объектов в JavaScript!

Это должно сработать:

deleteTask(taskId) {
  this.setState(prevState => ({
    tasks: prevState.tasks.filter(task => task.id !== taskId)
  }));
}