petroshevchenko1525

Два раза if в тернарном не рекомендуется, можно либо так.

year == 2015 ? alert('правильно') : alert('не правильно');

year == 2016 ? alert('правильно') : alert('не правильно');

Либо так.

year == 2015 || year == 2016 ? alert('правильно') : alert('не правильно');

Если исход одинаковый, можно условия комбинировать логическими операторами.
В данном случае логическим ИЛИ ||

const year = prompt('В каком году появилась спецификация ECMAScript-2015?');
alert( year == '2015' || year == '2016' ? 'правильно' : 'неправильно' );

then и catch относятся не к React а к JS, так что соответственно такие методы есть.

fetchData = () => {
  fetch(`https://........`)
    .then((response) => response.json())
    .then((data) => {
      const groupedData = data.group;
      this.setState({
        data: groupedData,
        car: Object.keys(groupedData)[0]
      }, this.filter);
    })
    .catch(() => {
      console.log("404 Not Found");
    });
};

const fetchData = () => {
    fetch('...')
        .then(response => response.json())
        .then(({ group }) => {
            this.setState({
                data: group,
                car: Object.keys(group)[0]
            }, this.filter);
        })
        .catch(error => {
            console.log('404 Not Found');
        });
};

Передать нужные параметры при вызове функции и использовать их в теле функции.

{Object.keys(startDataArray).map(item => (
  <button onClick={(event) => this.changeCategory(item)} className={item === category ? "active" : ""}>{item} category</button>
))}

//--//

changeCategory = (category) => {
    this.setState({ 
        category: category
    }, this.filter);
  };

Object destructuring

Долистайте до Object Destructuring > Assigning to new variable names

Вам бы жс подучить, прежде чем за реакт браться. Тривиальные примеры же.

Зачем в свойство searchInput я как значение передаю свойство searchInput?

Это уже к вас вопрос - зачем? Можно было просто:
({ searchInput, startDataArray: data, category })

Почему свойству startDataArray передаются аж два значения : data и category? Разве можно свойству обьекта давать два значения? Если да, то зачем в конкретном случае так сделали?

Запятую после data не видим?
data - это просто "псевдоним" для startDataArray, чтоб меньше буковок писать, category - просто отдельный параметр.

Почему в даном случае в метод filter передали аргументом функцию updater а не обьект?

Какой updater передали? Вы о чем вообще? filter принимает колбэк, который должен возвращать true/false соответственно. С чего вы взяли что туда нужно передавать объект?

Почему свойству startDataArray передаются аж два значения : data и category? Разве можно свойству обьекта давать два значения? Если да, то зачем в конкретном случае так сделали?

https://learn.javascript.ru/destructuring-assignme...

this.setState(
      ({ searchInput: searchInput,   // хз зачем они так написали
         startDataArray: data,   // в функции будет переменная data которая = this.state.startDataArray
         category  // более короткая запись чем category: category
      }) => {
        return {
          filteredDataArray: data[category].filter(item =>  // здесь data это state.startDataArray
            item.firstName.toLowerCase().includes(searchInput.toLowerCase())
          )
        };
      }
    );

Почему в даном случае в метод filter передали аргументом функцию

почему, this.filter не принимает аргументов

fetchData = async () => {
//
    this.setState({
        startDataArray: data,
        category: Object.keys(data)[0] 
      },
      // выполнить this.filter() после того, как стейт заполнится новыми данными
      this.filter);
  };

  filter = () => { // это просто стрелочная функция без аргументов
    this.setState(
      // берем параметры из стейта, заодно переименовываем startDataArray
      ({ searchInput: searchInput, startDataArray: data, category }) => {
        return {
          // возвращаем новое значение стейта
          filteredDataArray: data[category].filter(item =>
            item.firstName.toLowerCase().includes(searchInput.toLowerCase())
          )
        };
      }
    );
  };