DEV Community

Discussion on: Discoveries I made while using Typescript and React

Collapse
 
theodesp profile image
Theofanis Despoudis

Some tips:

  • It's better if you avoid extends and just use union types:
interface IProps  {
  theme: Theme;
}

type CustomInputProps = HTMLAttributes<HTMLInputElement> & IProps;
  • Only allow specific keys on an object: You are actually describing the Record type
type TListenerTypes = "onload" | "progress" | "error"

const x: Record<TListenerTypes, Function> = {
    a: "something", // wrong type
    progress: () => {},
    d: 10 // wrong type
};

Collapse
 
g1itcher profile image
G1itcher

Regarding avoiding extends and just using union types: this is the kind of statement that definitely should be explained/quantified. Very easy for a beginner to see a comment like this and take it the wrong way.

Collapse
 
hurricaneinteractive profile image
adro.codes

The Record type is really cool! Definitely going to add that into the article. I'll have a look into the union types a bit, looks promising!