在闭包中使用类或函数的方法

dmw*_*268 1 javascript closures reactjs

假设我想用一些方法创建一个Simple React组件(没有状态或生命周期方法).我可以通过以下两种方式之一做到:

// Foo.js
class Foo extends React.Component {
  doSomething() {
    // do something
  }

  render() {
    ...
    this.doSomething();
    ...
  }
}
export default Foo;
Run Code Online (Sandbox Code Playgroud)

或者我可以这样做:

// Foo.js
const doSomething = () => {
  // do something...
}

const Foo = () => {
  ...
  doSomething();
  ...
}
export default Foo;
Run Code Online (Sandbox Code Playgroud)

第二个是优选的,因为它是一个功能组件(更简单,开销更少),但是闭包功能是否会带来内存泄漏的任何开销/风险?

通常,如果组件不保持状态或使用生命周期方法,这是实现组件的首选方法?

Dan*_*ane 5

一般来说,如果你:

  • 不想维持 state
  • 不需要使用生命周期方法(如componentDidMount)

最好使用无状态功能组件,这些组件快速且可读性更高.不,您不必担心因关闭而导致的内存泄漏.有关无状态组件的更多优点,请参阅https://hackernoon.com/react-stateless-functional-components-nine-wins-you-might-have-overlooked-997b0d933dbc