typescript ComponentClass vs Component Отличия стандартных типах React

  • React.Component служит для того чтобы быть базовым типом для вашего класса - классового компонента:
    interface Props {
        products: string[];
    }
    interface State {
        quantities: { [key: string]: number };
    }
    class MyComponent extends React.Component<Props, State> {
    //.....

    -- для использования типа React.Component в вашем коде какой-то класс должен реально наследоваться от React.Component (и в случае если вы используете typescript, его парсер должен быть способен это обнаружить)/

    Если посмотреть исходники Реакт, то видно что под этим именем там фигурирует и описание класса и одновременно интерфейс:

     // Base component for plain JS classes
    interface Component<P = {}, S = {}, SS = any>
             extends ComponentLifecycle<P, S, SS> { }
    class Component<P, S> {
    

    -- класс, видимо, как раз используется для наследования вашим типом, а вот интерфейс для проверки типа сам по себе, и этот интерфес не содержит указания на констутруктор

  • React.ComponentClass - может быть использован как указание на тип любой переменной, за которой, как ожидается находися классовый компонент, Для применения этого типа не нужно явное указание наследования типа ....extends React.Component

    Вот описание его интрефейса:

        interface ComponentClass<P = {}, S = ComponentState> extends StaticLifecycle<P, S> {
            new (props: P, context?: any): Component<P, S>;
            propTypes?: WeakValidationMap<P>;
            contextType?: Context<any>;
            contextTypes?: ValidationMap<any>;
            childContextTypes?: ValidationMap<any>;
            defaultProps?: Partial<P>;
            displayName?: string;
        }
    

    в отличие от интерфейса React.Component тут есть конструктор, что и позволяет использовать его для указание типа компонента в функции.

Key Words for FKN + antitotal forum (CS VSU):