Javascript Строковое равенство с "===" - PullRequest
0 голосов
/ 18 марта 2020

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

handleLike = id => {
const movies = [...this.state.movies];
const movie = movies.filter(obj => obj._id === id);
if (movie.map(obj => obj.liked) == "fa fa-heart-o") {
  movie.map(obj => (obj.liked = "fa fa-heart"));
  this.setState({ movies });
} else {
  movie.map(obj => (obj.liked = "fa fa-heart-o"));
  this.setState({ movies });
}

В if (mov ie .map (obj => obj) .liked) == "fa fa-heart-o") Я не проверяю тип с помощью (===) , потому что по какой-то причине он будет ложным, но obj.liked после входа в консоль с typeof он говорит, что это String, поэтому он определенно должен быть правдивым, даже после того, как я добавил ToString (), он не стал правдивым ... Я дважды проверил все, я что-то упустил?

Спасибо в Advance!

1 Ответ

1 голос
/ 18 марта 2020

Вы делаете много лишних map пингов.

1) movies.filter(obj => obj._id === id); вернет массив из одного элемента, который является movie объектом. Чтобы получить реальный объект mov ie, вам нужно использовать movies.filter(obj => obj._id === id)[0];. Возможно, вы захотите использовать find (для захвата объекта mov ie) или findIndex для определения индекса нужного mov ie.

2) if (movie.map(obj => obj.liked) == "fa fa-heart-o") не имеет смысла - вы пытаетесь сравнить массив (map будет всегда возвращать новый массив) со строкой. Я удивлен, что это работает вообще.

На основании вашего комментария я мог бы переписать ваш код следующим образом:

handleLike = id => {

  const movies = [...this.state.movies];

  // Find the index of the movie where `_id` matches `id`
  const movie = movies.find(obj => obj._id === id);

  // If the movie at the index is liked (either true/false),
  // give the object a new property "icon" and give it a heart
  if (movie.liked) {
    movie.icon = "fa fa-heart";
  } else {

    // Otherwise give it an empty heart
    movie.icon = "fa fa-heart-o";
  }

  // Set the new state (only once)
  this.setState({ movies });

}
...