javascript - 将 "$.each(data, function (index)"转换为 CoffeeScript ？

Question

我在将其从 Jquery/Javascript 转换为 Coffeescript 时遇到了困难，仅仅是因为我是初学者，而且我发现它很难掌握。有人可以帮我吗？

    $.each(data, function (index) {
        arrayOfThings.push(data[index].thing);
    });

这是一个接受 AJAX“GET”数据的函数。

Answer 1

有更简洁的方法可以使用 $.each 来执行该循环。 。 $.each 将索引和元素传递给回调函数，因此您可以说:

$.each data, (index, e) ->
    arrayOfThings.push(e.thing)

$.each 还将 this (又名 CoffeeScript 中的 @)设置为当前元素，因此您也可以说:

$.each data, -> arrayOfThings.push(@thing)

并完全忽略回调参数。

由于您的 $.each 正在有效地展开数组，因此您可以使用 $.map而不是 $.each 来简化回调:

arrayOfThings = $.map data, (e) -> e.thing

CoffeeScript 函数有一个隐式返回，因此 -> x 与 -> return x 相同，这对于像这样的小型映射函数来说很方便。

如果您可以假设一个合理合理的 JavaScript 环境，那么您可以使用 native Array.prototype.map而不是 jQuery 的版本:

arrayOfThings = data.map (e) -> e.thing

CoffeeScript 中的循环是生成数组的表达式(有关详细信息，请参阅文档中的 Loops and Comprehensions)。这意味着您可以完全跳过 $.each 并使用 for ... in 循环:

a = (e.thing for e in data)

假设data是一个数组。如果 data 是一个具有对象值的对象，那么您可以使用 for ... of 循环:

a = (v.thing for k, v of data)

如果您已经有一个数组并想向其中添加新内容，您可以使用 concat :

a = a.concat(e.thing for e in data)

或使用push和一个CoffeeScript splat :

a.push((e.thing for e in data)...)

您可以将最后两个(即 concat 和 splat/push)与 $.map 和 Array.prototype 结合起来.map 版本也是如此。

演示:http://jsfiddle.net/ambiguous/Jq6Mh/2/