React js - HPC 和装饰器有什么区别
React js - What is the difference betwen HOC and decorator
谁能解释一下这两者有什么区别?
我的意思是除了语法上的差异,这两种技术是否都用于实现同一件事(即重用组件逻辑)?
出于所有实际原因,装饰器和 HOC(高阶组件又名包装器)做同样的事情。
一个主要区别是,一旦添加了装饰器,property/class 就只能以其装饰形式使用。 HOC 模式留下高阶和低阶组件可供使用。
进一步阅读装饰器 -> https://medium.com/google-developers/exploring-es7-decorators-76ecb65fb841
装饰器不是一个广泛实现的 JS 特性。它仍处于提案阶段。 Babel 7 默认允许装饰器作为其 stage 0 配置中的默认插件。
https://babeljs.io/docs/plugins/transform-decorators/
两个区别是装饰器用于改变变量,而 HOC 建议不要这样做。另一个是 React 特有的,HOC 应该渲染一个组件,而装饰器可以 return 不同的东西取决于实现。
我也很好奇为什么 React 社区将此称为 高阶组件 (HOC) 而不是 Decorator pattern, which seems to be what it exactly is doing and has been described in 1994 (!) by the Gang of Four (GoF): Erich Gamma, Richard Helm, Ralph Johnson, and John Vlissides.
另一个混淆来源是 ES7's decorator pattern 与 GoF 对装饰器模式的解释不同。不幸的是,情况就是这样。我本来希望与其重新定义现有术语,不如在限定它的同时重复使用该术语。即使这不可能,发明一个不同的术语也会更容易接受。
谁能解释一下这两者有什么区别? 我的意思是除了语法上的差异,这两种技术是否都用于实现同一件事(即重用组件逻辑)?
出于所有实际原因,装饰器和 HOC(高阶组件又名包装器)做同样的事情。
一个主要区别是,一旦添加了装饰器,property/class 就只能以其装饰形式使用。 HOC 模式留下高阶和低阶组件可供使用。
进一步阅读装饰器 -> https://medium.com/google-developers/exploring-es7-decorators-76ecb65fb841
装饰器不是一个广泛实现的 JS 特性。它仍处于提案阶段。 Babel 7 默认允许装饰器作为其 stage 0 配置中的默认插件。
https://babeljs.io/docs/plugins/transform-decorators/
两个区别是装饰器用于改变变量,而 HOC 建议不要这样做。另一个是 React 特有的,HOC 应该渲染一个组件,而装饰器可以 return 不同的东西取决于实现。
我也很好奇为什么 React 社区将此称为 高阶组件 (HOC) 而不是 Decorator pattern, which seems to be what it exactly is doing and has been described in 1994 (!) by the Gang of Four (GoF): Erich Gamma, Richard Helm, Ralph Johnson, and John Vlissides.
另一个混淆来源是 ES7's decorator pattern 与 GoF 对装饰器模式的解释不同。不幸的是,情况就是这样。我本来希望与其重新定义现有术语,不如在限定它的同时重复使用该术语。即使这不可能,发明一个不同的术语也会更容易接受。