React js - HOC和装饰者之间有什么区别

Question

有人可以解释这两者之间有什么区别吗？我的意思是除了语法差异,这两种技术都用来实现同样的事情(这是重用组件逻辑)吗？

Answer 1

出于所有实际原因,装饰者和HOC也做同样的事情.

一个主要的区别是,一旦你添加了一个装饰器,属性/类只能用在它的装饰形式中.HOC模式提供更高阶以及可用的低阶组件.

有关装饰器的进一步阅读 - > https://medium.com/google-developers/exploring-es7-decorators-76ecb65fb841
装饰器不是广泛实现的JS功能.它仍处于提案阶段.默认情况下,Babel 7允许装饰器作为其阶段0配置中的默认插件. https://babeljs.io/docs/plugins/transform-decorators/

Answer 2

另一个令人困惑的来源是ES7 的装饰器模式与 GoF 对装饰器模式的解释不同。不幸的是，情况确实如此。我希望与其重新定义现有术语，还不如在对其进行限定时重用该术语。即使这是不可能的，发明一个不同的术语也会更容易接受。

EcmaScript 中的装饰器不是一种模式，而是一种语言特性，就像变量、函数、类等都是语言特性一样。如果您了解模式和语言功能之间的区别，就不会感到困惑。此外，该名称对于模式和语言功能都有意义，因为在这两种情况下，装饰器都用额外的功能来装饰现有代码，而不直接修改该代码。 (2认同)

Answer 3

两个区别是装饰器用于改变变量，而 HOC 不建议这样做。另一个是 React 特有的，HOC 应该渲染一个组件，而装饰器可以根据实现返回不同的东西。