Javascript 构造函数中的绑定或类中的胖箭头

所以我想知道这两者之间是否有区别：

import React, { Component, PropTypes } from 'react';

class Example extends Component {
  constructor(props) {
    super(props);
    this.state = {
      page : 1
    };
  }

  nextPage = () => {
    this.setState({ page: this.state.page + 1 });
  }

  previousPage= () => {
    this.setState({ page: this.state.page - 1 });
  }

  render() {
    const { page } = this.state;
    return (
      <div>
        <H1>{page}</H1>
        <Button onClickPrevious={this.previousPage} onClickNext={this.nextPage} />}
      </div>
    );
  }
}

import React，{Component，PropTypes}来自'React'；
类示例扩展组件{
建造师（道具）{
超级（道具）；
此.state={
页码：1
};
}
下一页=（）=>{
this.setState（{page:this.state.page+1}）；
}
上一页=（）=>{
this.setState（{page:this.state.page-1}）；
}
render（）{
const{page}=this.state；
返回(
{page}
}
);
}
}

或

import React，{Component，PropTypes}来自'React'；
类示例扩展组件{
建造师（道具）{
超级（道具）；
this.nextPage=this.nextPage.bind（this）；
this.previousPage=this.previousPage.bind（this）；
此.state={
页码：1
};
}
下一页（）{
this.setState（{page:this.state.page+1}）；}
上一页（）{
this.setState（{page:this.state.page-1}）；}
render（）{
const{page}=this.state；
返回(
{page}
}
);   
}
}

我想知道这对每个函数的性能是一样的，还是有其他好处

---

进一步阅读（）

绑定事件处理程序的最佳位置是

构造函数。这样，事件处理程序将其上下文绑定到组件实例。您可以访问
props和state
，并从绑定的处理程序调用
setState
或
forceUpdate

使用
arrow
函数进行绑定也有其自身的优势。
箭头函数总是从定义它们的位置获取上下文。所以实际上，这个例子相当于：

箭头函数语法是一种使用如下语法定义函数的方法：

change = (ev) => this.setState({ text: ev.target.value });

这是一种比编写
函数（ev）{….}
语句更简洁的方法。如果在
=>
箭头后没有提供
{
和
}
括号，则该函数是一个立即返回的表达式。因此，这一点类似于：

change = function(ev) { return this.setState({ text: ev.target.value }); }.bind(this);

因此，
.bind（）
和
arrow
函数都会创建一个新函数

最后，您希望绑定函数的方式取决于您的用例

有关更多详细信息，请阅读文章：
当您从
组件扩展这些函数时，不需要绑定或fat箭头you@Dogoku
class
方法没有被隐式绑定我再看一遍这个问题，你是对的OK这很有意义。但您的意思是，如果您在构造函数中绑定它，您可以访问state和props。但是在第一个示例中（我没有隐式绑定我的函数），我可以更改状态。这两个例子都很好（因为我使用了fat arrow函数来绑定上下文，对吗？）。在最古老的组件类语法React.createClass中，绑定问题是不存在的。这是因为React.createClass在后台执行自动绑定。在传递给React.createClass的对象中定义的所有方法都将自动绑定到组件实例。这意味着您可以通过这些方法始终使用setState、访问道具和状态等。引述：
change = function(ev) { return this.setState({ text: ev.target.value }); }.bind(this);