Какие типы компонентов мне следует использовать в React: функциональные компоненты или базовые компоненты класса?

Question

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

Я хочу знать, имеет ли это значение для технологических компаний, когда кто-то подает заявку на позицию разработчика. Будут ли они смотреть на эти вещи? Так как они сильно различаются по реализациям ...

Answer 1

Существуют некоторые различия между компонентом метода и компонентом класса .

Компонент метода:

Самый простой способ объявить компонент в React. вам нужно только объявить метод, который возвращает jsx. пример :

const MessageComponent = ({ name }) => { return <h1>Hi {name}</h1> }

в дополнение к тому, что со времени введения React Hooks вы можете выполнять большинство функций, используя компонент метода

componentDidUpdate = > useEffect(fn)

componentDidMount => useEffect(fn, [])

state => useState()

Компонент класса:

надежная версия компонента. С компонентом класса вы можете сделать больше. Props будет по умолчанию в контексте класса this.props. Вы можете использовать состояние, локальную переменную для вашего компонента. Вы можете добавить метод многих классов, которые имеют одно и то же состояние.

export default class MessageComponent  extends Component {
  state = {
    message: 'default message'
  }

  renderMessage = () => {
    return (
      <h1>
        Hi {this.props.name}
      </h1>
    )
  }

  render() {
    return (
      <div>
        {this.renderMessage()}
      </div>
    )
  }
}

Компонент класса VS Метод компонента

Основная причина отказа от использования компонента класса заключается в том, что вам нужен только простой компонент, такой как button, card или представительский компонент. Если ваш компонент не нуждается в сложном состоянии, вам лучше всего подойдет сложная логика c, method component.

Answer 2

В настоящее время большинство разработчиков переключаются на функциональные компоненты, а не на компоненты класса, потому что может быть много причин, но некоторые из наиболее выгодных моментов:

1. Они более читабельны по сравнению с классом. на основе компонентов.
2. Легко тестировать и отлаживать, потому что для этого требуется меньше кода.
3. В соответствии с указаниями это может повысить производительность.

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

Answer 3

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

Сказав это, функциональные компоненты являются лучшим вариантом для нового кода. Они также поддерживают React Hooks, который заменяет методы жизненного цикла на основе классов.

Если вы пишете новый код, возможно, стоит сосредоточиться на написании компонентов функций. Но если вы подаете заявку на работу, существует высокая вероятность того, что существующие кодовые базы содержат компоненты класса и функции. Вам нужно будет уметь работать с обоими и уметь переводить одно в другое.

Answer 4

Ну, организации теперь, как правило, используют самые последние из существующих и нанимают кого-то, кто резонирует с чем-то новым.

Функциональные компоненты с новыми крючками, которые также заменяют метод жизненного цикла

• Легче управлять
• Большая совместимость, особенно с машинописным текстом
• Гораздо меньше и более понятный код

Answer 5

Функциональные компоненты - новый стандарт. Их легче держать легкими и удобочитаемыми. В высококачественном коде ни одному компоненту не нужно так много логики c, что это когда-либо более 30-50 строк, что делает вещи короткими и лаконичными, с учетом этого компонент класса просто большой и неуклюжий