Todavía no entiendo completamente la dicotomía de la herencia (prototipo versus clásico) en JavaScript.

Si elclass es solo un azúcar sintáctico sobre los prototipos, ¿cómo se supone que debo quitarle el azúcar?

¿Me puede mostrar los diferentes enfoques en la creación de elementos React con clases y prototipos (es decir, sinclass & React.createClass)?

Entonces, ¿hay alguna manera de obtener componentes con estado usando nativoObject.create?

Me gusta esto:

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 como esto no funcionará debido a las restricciones internas de la biblioteca.Pero, ¿por qué no podemos usarlo de forma más natural a prototípica de JavaScript?

Hay una nota de los documentos oficiales:https://facebook.github.io/react/docs/composition-vs-inheritance.html#so-what-about-inheritance

[...] no hemos encontrado ningún caso de uso en el que recomendaríamos crear jerarquías de herencia de componentes

Pero no esclass principalmente sobre herencia?

Estoy muy confundido y me gustaría escuchar tu opinión sobre lo que estoy haciendo y pensando mal.

Hice esa pregunta en Reactiflux y Brendan Hurley propuso esto: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'));

¿Es su solución realmente prototípica?

Aquí hay algunas referencias:

* La pregunta es principalmente sobre la herencia, no sobre React. Reaccionar aquí es solo una referencia.