Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
644 views
in Technique[技术] by (71.8m points)

reactjs - Why we don't need to bind the arrow function in React?

We all know that we need to bind function in React to make it work. I do know why do we need to bind it.

But I'm not sure why we don't need to bind arrow function.

Example: Using arrow function (No bind in required)

handleClick = () => {
  this.setState({
    isToggleOn: !this.state.isToggleOn
  });

};

Now, Using function (Bind is required)

this.handleClick = this.handleClick.bind(this);

handleClick() {
  this.setState({
    isToggleOn: !this.state.isToggleOn
  });

};

I'm not asking why we need bind in function. I just want to know why binding is not required in arrow function.

Thanks.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Simply because arrow function does not have the following in its context:

  • this
  • arguments
  • super
  • new.target

So when you reference this inside an arrow function it treat this as any other variable and look for its declaration in its scope first and it can not find it so it search the upper scope which is the this referring to the react component class which what is required so we do not need to bind the this to the class.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...