Javascript 使用方法渲染vs变量有什么好处？

这两者之间是否有任何真正的区别（使用其中一个的优势）：

class Thing extends Component {
  renderStuff() {
    // Tons of conditional code, etc
    return someValue;
  }

  render() {
    return <div>
      {this.renderStuff.call(this)}
    </div>
  }
}

类扩展组件{
renderStuff（）{
//大量的条件代码等
返回一些值；
}
render（）{
返回
{this.renderStuff.call（this）}
}
}

vs:

类扩展组件{
render（）{
让一些东西有价值；
//这里有成吨的条件代码，用来确定someValue的值
返回
{someValue}
}
}

或者这仅仅是一个风格决定吗？

简短回答：

解决问题的第一种方法是更简洁，允许您重用函数

renderStuff

。跟那个去

更长：

---

虽然从技术上讲，与第二种方法相比，它至少会涉及一个以上的函数调用，但我怀疑这会显著影响代码的性能。我会说这归结为风格，我会说你的第一个版本是最好的。您的

render

函数更清晰易读，您可以重用

renderStuff

。第二个选项的性能优势在于只需少调用一次函数。

如果它是一个常量，则可能不需要将

renderStuff

作为一个方法，尽管如果该值从未更改，那么为什么不将其作为HTML的一部分呢？请注意“编程内容”假设这是一大块有条件的东西，太复杂了，不能在

渲染

中的主

块中抛出。编辑我的帖子以使其更清晰。从逻辑上讲，我会使

渲染

只包含渲染代码，如果

某些值

需要使用条件等进行计算，则将其包含在

渲染

方法中。要对此进行扩展，react是关于划分代码或模块化代码的。如果您可以将复杂的查询和逻辑分解为更小、更易于管理的块，那么您就做对了。如果您有一个

render

函数，它有100行长，可以输出几个div，那么您就做错了。

class Thing extends Component {
  render() {
    let someValue;

    // Tons of conditional code here, to determine the value of someValue

    return <div>
      {someValue}
    </div>
  }
}