Question

箭头函数可以在ES6类定义中使用吗？我不被问是否应该，但是可以吗？

阅读他的MDN article说他们是ill suited as methods后，我感到很好奇。

如果是，正确的语法是什么？

class someComponent extends React.Component {
  constructor(props) {
    super(props);
   }

  // arrow function here

  render () {
  }
}

研究

Currying with Arrow Functions

Answer 1

据我所知，没有正确的语法，因为箭头功能没有任何好处。但是，如果您想知道如何在类中很好地包含一个箭头功能...在这里，您可以进行以下操作：

class someClass {
  constructor() {
    this.myTestProperty = "fus ro dah";
    this.someArrowMethod = () => {
      console.log("Arrow Method: ", this.myTestProperty);
    };
  }

  method() {
    console.log("Normal Method: ", this.myTestProperty);
  }

  //ERROR: this is illegal in node v10 but webpack or typescript may be able to compile it correctly. 
  illegalArrowMethod = () => {

  }
}

const something = new someClass();

something.method();
something.someArrowMethod();

如您所见，正确的类Object的属性仍然可以通过常规Method中的this关键字获得。因此，我想不出为什么要在类中使用箭头功能的用例。

Answer 2

是的。您现在需要像babel这样的编译器以及相应的插件来对它们进行转换。

plugins: ["transform-object-rest-spread", "transform-class-properties"],

这些方法在需要用作事件处理程序的回调时特别有用。

反应对象

  clickHandler = () => {
    // this is A. O.K.
  }

反应渲染功能

<div className="scene" onClick = {this.clickHandler} >

ES6类定义中可以使用箭头功能吗？

2 个答案: