В чем отличие между React.createClass и class extends React.component?

Недавно начал учить React по видео-урокам. Пробовал писать всякие "штуки" на нем и как-то наткнулся на переведенную на русский официальную документацию вот с таким вот примером:
class Form extends React.Component { constructor(props) { super(props); this.state = {value: ''}; this.handleChange = this.handleChange.bind(this); this.handleSubmit = this.handleSubmit.bind(this); }
handleChange(event) { this.setState({value: event.target.value}); }
handleSubmit(event) { alert('Text field value is: ' + this.state.value); }
render() { return (

); } }
ReactDOM.render(

, document.getElementById('root') );
В видео-уроках по которым учился я было немного не так, а именно:
В чем отличие от создание компонента путем наследования class Form extends React.Component от обычного React.createClass()? Зачем в конструкторе класса привязывается this с помощью bind, если оно и без этого работает? В чем вообще преимущество кода из документации перед моим кодом? (ниже)

var Form = React.createClass({ getInitialState: function(){ return { value: "" } }, handleChange(e){ this.setState({value: e.target.value}); }, handleSubmit(e){ alert("Text field value is: " + this.state.value); }, render: function(){ return (

); } });
ReactDOM.render( , document.getElementById('root') );
Заранее спасибо:3

Ответ

Это два способа сделать одно и то же. В самом фейсбуке считают es6 классы более семантически верными и лелеют себя мыслью когда-нибудь в далеком-далеком счастливом будущем поддержку React.createClass прекратить (источник, первый абзац). Но будет это не в ближайший год и не в два, пока createClass даже не deprecated.
Ответ на ваш третий вопрос: пока это два равнозначных способа. Лучше привыкать писать es6-классы, но как там будет в будущем на самом деле предсказать сложно.
Главные отличия:
Классы - это es6 фича. Соответственно вся транспиляторская магия для полноценной работы с es6 у вас должна присутствовать. В React.createClass внутри работает тайная магия которая автоматически биндит все методы переданные в createClass к this. В компонентах es6-классов от такой штуки решили отказаться, потому что она часто смущала разработчиков, и биндить надо ручками. Оттуда кстати вытекает ответ на ваш второй вопрос: без этого - не работает. В компонентах-es6-классах нет миксинов. Совет мудрецов разрабатывающих реакт решил что миксины нехорошо, хорошо - композиция. И решил не давать возможность писать нехорошо в новых версиях. Вместо getInitialState используется constructor так как решили что это идиоматичнее для es6 классов, также propTypes - свойство самого класса, вместо метода getDefaultProps есть свойство класса defaultProps
Возможно есть еще какие-то отличия о которых я не вспомню, лично у меня в рабочем проекте есть и createClass в старом коде и es6 классы в новом. getInitialState аутобиндинг и propTypes - это явные заметные отличия, es6 итак уже обычно есть, миксины используют довольно редко.