在 coffeescript 中迭代 jQuery DOM 元素：$(@)。捷径答案

【问题标题】：Iterating over jQuery DOM elements in coffeescript: $(@). shortcut在 coffeescript 中迭代 jQuery DOM 元素：$(@)。捷径
【发布时间】：2012-08-04 20:02:57
【问题描述】：

我的咖啡脚本中有很多循环，它们遍历 DOM 元素的集合，并执行更多的 jQuery。这些函数看起来像这样：

$('.iterable.object').each ->
    $(@).doThis
    $(@).doThat

    ## More complicated usage
    $(@).jqueryPluginCall
        x: $(@).data('attr1')
        x: $(@).data('attr2')

    ## More complicated usage
    $(@).children('ul.animateable').each ->
        if $(@).data('animation') is "fancy"
            $(@).animate fancy: animation
        else
            $(@).animate simple: animation
        $(@).focus(
            ->
                $(@).animate some: more
            , ->
                $(@).animate even: more
        ) ## Or however you do double callbacks

我一次又一次地在$(@). 中输入了大约 3 个拼写错误，这变得很痛苦。

$(@) 没有快捷语法？打字有点痛苦，而且似乎是一种很常见的语法。如果它以类似于@ 作为自动函数调用者的方式运行，那就太酷了，比如&doThis 而不是&.doThis。

编辑：我希望能够在jQuery加载后在javascript中定义一个别名，当调用&并链接到方法&doThis时响应DOM元素，而不是像@bennedich在下面建议的那样在每个循环的顶部.

【问题讨论】：

也许我只是老了，但$(@) 已经很简洁了......
我有点挑剔。我有很多这样的人。 (500+)
不应该是$('.iterable.object').each -> ...吗？
人们往往会忘记$("foo").each(function() { $(this).bar(); }); 与$("foo").bar() 相同。不是你的情况吗？
我实际上是在该循环中执行更复杂的 CS。这是一个示例，但我会更新以演示复杂性。

标签： javascript coffeescript shortcut

【解决方案1】：

函数链怎么样：

$('.iterable.object').each ->
  $(@)
    .doThis()
    .doThat()

或将$(@) 存储到变量中：

$('.iterable.object').each ->
  t = $(@)
  t.doThis()
  t.doThat()

或者两者的结合。我能想到的最后一件事是 IDE sn-ps，例如textmate 会让你配置字母+TAB 替换为$(@)。

【讨论】：

就个人而言，如果我要多次使用一个 jquery 对象，我总是通过将它放在一个变量中来缓存它。提高性能和可读性。 +1
我猜@(this) 已经作为变量缓存在循环的作用域中，但反复处理成一个 jQuery DOM 元素 ($(@)) 不是吗？跨度>
如果方法返回 jQuery 元素，您也可以在一行中执行 $('.iterable.object') -> t = $(@).doThis().doThat()