Как написать общую функцию для двух функций в реаги - PullRequest
Новая
       56

Как написать общую функцию для двух функций в реаги

0 голосов
/ 21 ноября 2018

У меня есть класс, в котором есть два метода handleChange(e) и cardClick(e), и я хочу отсортировать массив объектов обеих функций.Мой код: 

handleChange(e){
arr.sort(compare);
            function compare(a, b){
                if(a.population === 'unknown')
                    return 1;
                if(b.population === 'unknown')
                    return -1;
                if(parseInt(a.population) < parseInt(b.population))
                    return 1;
                else if(parseInt(a.population) > parseInt(b.population))
                    return -1;
                else
                    return 0;
            }
}

и 

cardClick(e){
arr.sort(compare);
            function compare(a, b){
                if(a.population === 'unknown')
                    return 1;
                if(b.population === 'unknown')
                    return -1;
                if(parseInt(a.population) < parseInt(b.population))
                    return 1;
                else if(parseInt(a.population) > parseInt(b.population))
                    return -1;
                else
                    return 0;
            }
}

Я должен написать определение функции сравнения в handleChange и cardClick.Есть ли у них какой-либо способ, чтобы мне не приходилось писать это дважды, и я могу использовать его в обеих функциях.

1 Ответ

0 голосов
/ 21 ноября 2018

Вы можете определить функцию вне класса и использовать ее в обоих обработчиках событий.

Пример 

function compare(a, b) {
  if (a.population === "unknown") return 1;
  if (b.population === "unknown") return -1;
  if (parseInt(a.population) < parseInt(b.population)) return 1;
  else if (parseInt(a.population) > parseInt(b.population)) return -1;
  else return 0;
}

class App extends React.Component {
  handleChange = e => {
    arr.sort(compare);
    // ...
  };

  cardClick = e => {
    arr.sort(compare);
    // ...
  };

  render() {
    // ...
  }
}
...