标签: arrow-functions

我最近切换到es6并开始在我的代码中使用箭头函数.在重构时我遇到了代码

data.map(function(d) {
   return {id: d.id, selected: bool};
});

我将上面的代码改为此 -

data.map((d) => {id: d.id, selected: bool});

但是我从上面的代码中得到了错误.我不知道这里有什么问题？我知道如果没有代码块,则会有箭头函数提供的隐式返回.

但是不知道如何返回空对象或匿名对象,并初始化了一些属性？

编辑:

如果我这样做会有什么问题？只是出于好奇的缘故.

data.map((d) => new {id: d.id, selected: bool});

ES6中的箭头函数没有arguments属性,因此arguments.callee无法工作,即使只使用匿名函数也无法在严格模式下工作.

箭头函数无法命名,因此无法使用命名的函数表达式技巧.

那么......如何编写递归箭头函数？这是一个箭头函数,根据某些条件递归调用自身等等当然？

有谁知道如何使用ES6箭头语法编写立即函数？

这是ES3/5的做法:

(function () {
   //...
}());

我尝试了以下但unexpected token在最后一行得到错误.

(() => {
  //...
}());

你可以在这里测试一下:http://www.es6fiddle.net/hsb8bgu4/

我正在使用ReactJS与Babel和Webpack以及使用ES6以及箭头函数的建议类字段.我理解箭头函数通过不重新创建每个渲染的函数来使事情更有效,类似于构造函数中的绑定方式.但是,如果我正确使用它们,我并不是100%确定.以下是我的代码在三个不同文件中的简化部分.

我的代码:

Main.js

prevItem = () => {
    console.log("Div is clicked")
}

render(){
    return (
         <SecondClass prevItem={this.prevItem} />
    )
}

SecondClass.js

<ThirdClass type="prev" onClick={()=>this.props.prevItem()} />

ThirdClass.js

<div onClick={()=>{this.props.onClick()}}>Previous</div>

题:

上面的代码是否正确使用箭头功能？我注意到对于SecondClass.js我也可以使用:

<ThirdClass type="prev" onClick={this.props.prevItem} />

由于我在原始函数定义中使用了ES6箭头函数,因此一种方法或另一种方法之间是否存在差异？或者我应该一直使用箭头语法直到我的最后一个div？

我有一个coffeescript类,它有一些jquery事件监听器.我想使用胖箭=>来避免引用类,但我仍然需要引用通常会使用的元素this.我怎么能同时使用？

class PostForm
    constructor: ->
        $('ul.tabs li').on 'click', =>
            tab = $(this)
            @highlight_tab(tab)
            @set_post_type(tab.attr('data-id'))

    highlight_tab: (tab)->
        tab.addClass 'active'

    set_post_type: (id) ->
        $('#post_type_id').val(id)

我不知道箭头函数是否绑定arguments到词法范围.

看一下这个例子(可以使用相同的概念this):

var b = function() { return () => console.log(arguments); };
b(1,2,3)(4,5,6); // different result of chrome vs FF.

当我在Chrome上运行时,我得到了[1,2,3],但在Firefox上,我得到了[4,5,6].这是怎么回事？

我只是想找出为什么这是无效的原因:

() => throw 42;

我知道我可以通过以下方式绕过它:

() => {throw 42};

我试图理解何时this在ES6箭头函数中进行词法绑定的规则.我们先来看看这个:

function Foo(other) {
    other.callback = () => { this.bar(); };

    this.bar = function() {
        console.log('bar called');
    };
}

当我构造a时new Foo(other),在另一个对象上设置回调.回调是一个箭头函数,并且this箭头函数在词法上绑定到Foo实例,因此Foo即使我没有保留对Foo周围的任何其他引用,也不会进行垃圾回收.

如果我这样做会怎么样？

function Foo(other) {
    other.callback = () => { };
}

现在我将回调设置为nop,我从不提及this它.我的问题是:箭头功能是否仍然是词法绑定this,Foo只要活着就保持other活着,或者Foo在这种情况下可能是垃圾收集？

我已经从传统形式转换了一些类:

class TestOverloads {
    private status = "blah";
    public doStuff(selector: JQuery);
    public doStuff(selector: string);
    public doStuff(selector: any) {
        alert(this.status);
    }
}

改为使用箭头函数表达式:

class TestOverloads2 {
    private status = "blah";
    public doStuff = (selector: any) => {
        alert(this.status);
    }
}

以便在回调中使用类方法时避免使用作用域问题(请参阅此处了解背景信息).

我无法弄清楚如何重新创建我的重载函数签名.使用胖箭时如何编写重载？

我见过这样的JavaScript代码:

let a = () => ({ id: 'abc', name: 'xyz' })

( … )在这种情况下,包装对象的括号引用了什么？这是速记return吗？