Como a herança prototípica no JavaScript realmente funciona?

Ainda não entendo completamente a dicotomia de herança (prototípica versus clássica) em JavaScript.

Se oclass é apenas um açúcar sintático sobre protótipos, como eu devo retirá-lo?

Você pode me mostrar as diferentes abordagens na criação de elementos React com classes e protótipos (ou seja, semclass & React.createClass)?

Então, existe uma maneira de obter um componente stateful usando nativoObject.create?

Como isso:

const Hello = Object.create(React.Component.prototype, {
  componentDidMount: {
    value: function() {
      alert('Mounted');
    }
  },
  render: {
    value: function() {
      return <div>I love StackOverflow community! It is so helpful and friendly</div>;
    }
  }
});

ReactDOM.render(<Hello />, document.getElementById('root'));

Parece que algo assim não funcionará por causa das restrições da lib interna.Mas por que não podemos usá-lo na natureza mais natural e prototípica do JavaScript?

Há uma observação dos documentos oficiais:https://facebook.github.io/react/docs/composition-vs-inheritance.html#so-what-about-inheritance

[...] não encontramos nenhum caso de uso em que recomendamos a criação de hierarquias de herança de componentes

Mas não éclass principalmente sobre herança?

Estou muito confuso e gostaria de ouvir suas opiniões sobre o que estou fazendo e pensando errado?

Fiz essa pergunta na Reactiflux e Brendan Hurley propôs isso:https://codepen.io/niechea/pen/xdVEvv?editors=0010

function MyComponent(props) {
  this.props = props;
  this.state = {
    clickCount: 0,
  };
}

MyComponent.prototype = Object.create(React.Component.prototype);

MyComponent.prototype.clickHandler = function() {
  this.setState({
    clickCount: this.state.clickCount + 1,
  });
}

MyComponent.prototype.render = function() {
  return (
    <div>
      <p>Hello, {this.props.name}.</p>
      <p>You have clicked {this.state.clickCount} time(s)!</p>
      <button onClick={this.clickHandler.bind(this)}>Click me</button>
    </div>
  );
}

ReactDOM.render(<MyComponent name="Bogdan" />, document.getElementById('app'));

A solução dele é verdadeiramente prototípica?

Aqui estão algumas referências:

http://javascript.crockford.com/prototypal.htmlhttps://medium.com/javascript-scene/the-two-pillars-of-javascript-ee6f3281e7f3http://henleyedition.com/making-inheritance-make-sense-with-object-create/

* A questão é principalmente sobre herança, não sobre React. Reagir aqui é apenas uma referência.

questionAnswers(6)

yourAnswerToTheQuestion