Javascript 为什么变异会使react组件无法在其上重用'；他自己的？

因此，我正在阅读HOC上的react文档（可在此处找到：），其中有以下部分：

“抵制在HOC中修改组件原型（或对其进行变异）的诱惑。”

“这有几个问题。一个是输入组件不能与增强组件分开重用。”

为什么变异的输入组件不被认为是可重用的，而包装的组件是可重用的

---

编辑：如果你认为文档的这一部分只是胡说八道，如果有一些解释的话，我会接受这个回答。

修改

InputComponent

的原型会改变

InputComponent

的定义，并且会影响

InputComponent

的每个实例

---

如果您以一种私有的、封装的方式修改原型——也就是说，以一种无人知晓的方式——那么就没有人知道什么是

InputComponent

，因此他们无法可靠地使用它。

考虑

logProps（InputComponent）

（故意忽略返回值）现在，即使

InputComponent

没有声明实现

logProps（）

修饰的接口，它仍然实现，因为它已经被变异了。“<代码>增强组件= = =输入组件< /代码>是一件坏事，不是好事。考虑当您在应用程序的一部分使用<代码> LogPROPS（输入组件）< />代码时，在您的应用程序的另一部分中使用代码> DONTLogLogPro（输入组件）< /代码>。所以通过改变componentA，我打破了在它的类定义中建立的契约，当我随后在应用程序的某个部分得到componentA时，我不知道我在用什么，对吗？基本上和mixin的问题是一样的。如果你觉得正确的话，请使用Lmk。mixin稍微不那么糟糕，因为它们的约定是与声明存在于同一个位置，因此它们实际上被视为契约的一部分，即使它们改变了类定义。但在其他方面，你的比较是准确的。

function logProps(InputComponent) {
  InputComponent.prototype.componentWillReceiveProps = function(nextProps) {
    console.log('Current props: ', this.props);
    console.log('Next props: ', nextProps);
  };
  // The fact that we're returning the original input is a hint that it has
  // been mutated.
  return InputComponent;
}

// EnhancedComponent will log whenever props are received
const EnhancedComponent = logProps(InputComponent);