javascript - 箭头功能在浏览器中不起作用

Question

下面的方法效果很好

var DBBox = React.createClass({
  loadArticlesFromServer: function() {
  $.ajax({
    url: this.props.url,
    dataType: 'json',
    data: {username:data.username,isPublished:data.isPublished, heading:data.heading},
    cache: false,
    success: function(data) {
      this.setState({data: data});
    }.bind(this),
    error: function(xhr, status, err) {
      console.error(this.props.url, status, err.toString());
    }.bind(this)
  });
},

但是如果我像这样将第 2 行的方法声明更改为箭头函数

loadArticlesFromServer: ()=> {  //error - Cannot read property 'props' of undefined at line 6

或

loadArticlesFromServer= ()=> {  //Syntax error

我是否错误地使用了箭头功能或遗漏了什么？或者不支持？我正在使用 chrome 并尝试启用和谐标志，但没有任何运气。

Answer 1

箭头函数表达式最适合非方法函数。让我们看看当我们尝试将它们用作方法时会发生什么。

'use strict';
var obj = {
  i: 10,
  b: () => console.log(this.i, this),
  c: function() {
    console.log( this.i, this)
  }
}
obj.b(); // prints undefined, Window
obj.c(); // prints 10, Object {...}