Javascript 对react组件使用ES6类语法

Javascript 对react组件使用ES6类语法,javascript,inheritance,reactjs,ecmascript-6,prototypal-inheritance,Javascript,Inheritance,Reactjs,Ecmascript 6,Prototypal Inheritance,据我所知,有两种方法可以使用ES6创建和导出react类 也许是老办法: export default React.createClass({ ... }); 也许可以考虑新的方式: export class Todo extends React.Component { ... }; 今天有人问我为什么我更喜欢“旧”的方式而不是“新”的方式。除了“新”方式使用扩展,结果是继承之外,我没有一个好的答案。我在c#学会了总是喜欢写作而不是继承。在javascript中,95%的情况下,

据我所知,有两种方法可以使用ES6创建和导出react类

也许是老办法:

export default React.createClass({
   ...
});
也许可以考虑新的方式:

export class Todo extends React.Component {
   ...
};
今天有人问我为什么我更喜欢“旧”的方式而不是“新”的方式。除了“新”方式使用扩展,结果是继承之外,我没有一个好的答案。我在c#学会了总是喜欢写作而不是继承。在javascript中,95%的情况下,与原型继承相比,更喜欢使用揭示模块模式

作为一个全新的反应,我的问题是,为什么新方法比旧方法更好,我是否遗漏了一些东西?在我看来,拥有一个接受参数并返回一个对象的函数比继承一个对象要干净得多


TodoComponent,也许不太好,也许,或者添加某种装饰器,而不是从反应中延伸。组件?

< P>我不能告诉你哪个更好,我在中间。但是有一件事你必须记住,大多数人会使用新的语法,特别是随着ES6变得更加可用。你应该习惯于看到它并使用它,因为将来当人们迁移到它时,你会看到越来越多的例子。这几乎是一个必要的保持相关,而不是后退。你会习惯的,实际上我开始越来越喜欢它了。

我倾向于总是看React团队的例子作为指导。在这种情况下,他们为ES2015提供了专门的解决方案。这显然涵盖了您所指的“新”语法


我还仔细阅读了很多代码,了解事情是如何完成的。大多数使用ES2015的项目也在使用“新”语法。

由于现代浏览器尚未完全支持ES6,ES6语法将被传输到ES5中。旧方法的一个好处是[mixin]只能以旧方法使用。新方法将减少键入和一些额外功能。特别是通过箭头函数确定范围!结帐: