Перейти к основному содержимому

Typescript

Типизирование​

Если на проекте используется TS то его следует использовать везде, желателньо без использования any. Если нет возможности добавить типизацию сразу же, можно добавить глобальний тип TODO_TYPE, чтобы проще было найти то, что нужно доработать, например:

export type TODO_TYPE = any;

Enum​

Используйте Enum для констант

Хорошо
enum Status {
  Success = 'success',
  Error = 'error',
}

const status = Status.Success;
Плохо
const status = 'success';

Почему React.FC не нужен?​

Сегодня общее мнение заключается в том, что React.FunctionComponent (или сокращение React.FC) не нужен.

Три основных момента, заключаются в следующем:

  1. Существует неявное определение children - все ваши компоненты будут иметь типизированных children.
  2. Он не поддерживает дженерики.
  3. Некорректно работает с defaultProps.
// before
type Props2 = { id: number };
export const MyComponent2: React.FC<Props2> = (props) => {
    return <span>{props.id}</span>
}

// after
type Props2 = { id: number };
export const MyComponent2 = (props: Props2) => {
    return <span>{props.id}</span>
}

Опциональные параметры​

Добавляйте опциональность "?:" к параметру только если он действительно таковым является

const UsersItem = ({
  avatar,
  name,
}: {
  avatar: string;
  name?: string; // Плохо: важный параметр
}) => (
    <div>
      <img src={avatar} alt={name} />
      <p>{name}</p> {/* Ошибка: name может быть undefined а это не обработано */}
    </div>
)