MENU


Specialization

A classical use case of inheritance is when we need to specialize a class out of a generic parent class, ie. When X is a type of Y, we inherit and extend Y to define X.

This can easily be achieved by composition too. Say, <WelcomeDialog> is a special kind of <Dialog>, we can simply render <Dialog> in <WelcomeDialog>:


RESETRUNFULL
function Dialog(props) {
  return (
    <FancyBorder color="blue">
      <h1 className="Dialog-title">
        {props.title}
      </h1>
      <p className="Dialog-message">
        {props.message}
      </p>
    </FancyBorder>
  );}function WelcomeDialog() {
  return (
    <Dialog
      title="Welcome"
      message="Thank you for visiting our spacecraft!" />
  );}