这些可以互换吗？

简短的回答：没有。

让我们来看看您发布的不同片段：

someFunction() 对比 someFunction

使用前一种语法，您实际上是在调用该函数。后者只是对该函数的引用。那么我们什么时候使用哪个？

• someFunction()当您希望调用该函数并立即返回其结果时，您将使用。在 React 中，当您将部分 JSX 代码拆分为单独的函数时，通常会看到这种情况；出于可读性或可重用性的原因。例如：

  render() {
    myFunction() {
      return <p>Foo Bar</p>;
    }
    return (
      <div>
        {myFunction()}
      </div>
    );
  }
  

• someFunction当您只想将对该函数的引用传递给其他函数时，您将使用它。在 React 中，这通常是一个事件处理程序，通过它传递给另一个子组件，props以便该组件可以在需要时调用事件处理程序。例如：

  class myApp extends React.Component {
    doSomething() {
      console.log("button clicked!");
    }
    render() {
      return (
        <div>
          <Button someFunction={this.doSomething} />
        </div>
      );
    }
  }
  
  class Button extends React.Component {
    render() {
      return (
        <button onClick={this.props.someFunction}>Click me</button>
      );
    }
  }
  

someFunction() 对比 this.someFunction()

这与函数的上下文有关。基本上，“这个功能在哪里？”。是当前 Component 的一部分，然后使用this.someFunction()，它是作为 props 传入的父 Component 的一部分，然后使用this.props.someFunction(). 它是当前方法中的一个函数，然后只需使用someFunction().

显然，它的内容远不止这些，但这是我能给出的最好的基本总结。

为了更好地理解，请阅读此处。这是一个很好的指南，说明this关键字在 Javascript 中的工作方式，特别是在 React 中。

如果你想调用一个函数选项 2 并且有一些假设 5 应该可以工作。

如果您想将一个函数作为属性实际传递给某个子组件，以便它可以稍后调用它（比如在某个事件上通知您的根元素），那么选项 1（使用 prebind）和 3（使用定义变量const {handleAddTodo} = this和 prebind ： ） ） 应该管用

// this works if handleAddTodo was prebinded or doesn't use this
handleAddTodo ={this.handleAddTodo} 

// this probably wont work unless handleAddTodo is higher order function that returns another function
handleAddTodo ={this.handleAddTodo()} 

// This wont work unless you have a var/let/const that is referencing a function
handleAddTodo ={handleAddTodo} 

// Same as 1
handleAddTodo ={this.handleAddTodo} 

// 3 and 2 combined
handleAddTodo ={handleAddTodo()} 

要调用该函数，您必须添加 ()

{this.handleAddTodo()}   

关于处理事件 -处理#Events

箭头函数 - Functions#ArrowFunctions

在 ES6 中，您可以使用普通函数或箭头函数：

功能 1（正常功能）

functionA(){
   //Something here
}

然后应该调用this.functionA()

函数 2（箭头函数）

functionA = () => {
   //SomeThing Here
}

然后应该调用this.functionA

*Function3（例如：在 React 的常量中）*

const A = (functionTest) =>{
  return (
     <div>{functionTest}</div>
    );
}

functionTest是 React 中的 mapStateToProps :)

我希望它对你有帮助:)