javascript - React 生命周期方法作为类属性箭头函数

Question

我现在在一个古怪的 React 代码库中工作，其中所有组件函数都被编写为类属性箭头函数，例如

componentDidMount = async () => {
  console.log('componentDidMount');
};

当然，像这样绑定生命周期方法没有任何好处。但是，我想知道是否存在潜在的缺点，也许在 React 的内部与继承有关。

标签： javascriptreactjsecmascript-6

Answer 1

我看到类属性箭头函数的一个缺点：想象某种网格，其中每个单元格都是同一个 React 组件类的实例。如果生命周期函数是普通函数，它们只会在内存中、原型上存在一次。如果它们是类属性箭头函数，则每个单元格都有自己的函数副本。正如评论中提到的Medium 文章所衡量的那样，这将影响性能。（那篇文章中关于缺少原型会使测试复杂化的说法似乎是站不住脚的。）

（顺便说一句，似乎值得一提的是，整个主题可能会随着 React 钩子的采用而过时。）