Question

= () =>在以下代码中的含义

enterclass Counter extends React.Component {
  tick = () => {
    ...
  }
  ...
} code here

Answer 1

在您的示例中，它为tick变量分配了一个函数。 () => { ... }是函数。这是一个ES6风格的箭头＆＃34;功能表达。这些类似于function表达式（tick = function() { ... }），除了函数中的this值是从它定义的上下文继承而不是在调用函数时设置的

这是一个区别的简单示例（需要启用ES6的JavaScript引擎）：

var obj = {
  method: function() {
    var a = ['x'];
    snippet.log("this === obj? " + (this === obj));
    a.forEach(function() { // Non-arrow function
      snippet.log("nonarrow this === obj? " + (this === obj));
    });
    a.forEach(() => {      // Arrow function
      snippet.log("arrow this === obj? " + (this === obj));
    });
  }
};
obj.method(); // this == obj? true
              // nonarrow this === obj? false
              // arrow this === obj? true

关于Babel的REPL的

Live Copy

请注意箭头功能this与创建它的上下文中的this相同，但非箭头功能this不是＆{ ＃39; t（相反，它由forEach调用它来设置）。

Answer 2

这是ES6的一项名为“箭头功能”的功能：https://github.com/lukehoban/es6features#arrows

它基本上是一个简写：

var tick = function () { ... }.bind(this);

什么=（）=＆gt;反应组分的含义

2 个答案: