Javascript Coffeescript/jQuery模式：跨事件缓存数据

我有一个项目列表，这些项目是抽象的，可以通过单击Ajax进行扩展。我在Coffeescript中编写了以下代码：

current_open_row = null

$('li.faq-item').live 'click', (event) ->
  $.post("/faqs/update_rows", {old_row_id: current_open_row, new_row_id: $(this).attr('id')}, (data) ->
    replace_items data
  , 'json')
  current_open_row = $(this).attr('id')

这读起来不像smooth Coffeescript，我发现自己在想，“我能做得更好吗？”但特别是，在click处理程序范围之外实例化

当前\u open\u行

变量感觉很奇怪。当然，不这样做会在进入处理程序时导致一个新的实例化，而这个实例化总是未定义的

除了将

$（this.attr（'id'）

重构为一个变量之外，还有什么东西会跳出丑陋、次优、不可读等状态，或者就是这样吗

---

谢谢

首先，我想你最终会发现自己转向camelCase。。。我知道很多人非常喜欢下划线的可读性，但是与之交互的每个库（包括jQuery）都使用camelCase。只是要记住一些事情

撇开这一点不谈，必须用

=null

来定义变量的范围是一个好问题。我试图说服Jeremy应该有一个更好的范围语法，但他坚决反对。所以我建议将变量移动到对象属性。幸运的是，这是jQuery，因此有很多地方可以粘贴数据。使用列表的方法怎么样？这还有一个额外的优点：如果您希望将来在多个列表上执行此操作（每个列表中有一行

当前的\u open\u行

），则无需更改一位代码。只需在标记中添加更多带有

.faq item

子项的列表

还有一个小问题：您给

post

调用一个回调

(data) -> replace_items data

如果这就是你要做的，为什么不直接传递

replace_items

为了便于阅读，我还将每个参数放在

post

函数自己的行中。即使没有大括号，键值对也会自动组合到单个对象中。这一切看起来是这样的：

$('li.faq-item').live 'click', (event) ->
  $row = $(this)
  $list = $row.parent()
  row_id = $row.attr 'id'

  $.post(
    "/faqs/update_rows",
    old_row_id: $list.data('current_open_row'),
    new_row_id: row_id,
    replace_items,
    'json'
  )

  $list.data 'current_open_row', row_id

---

谢谢这真的很有帮助。我相信snakeCase在Javascript中是不错的，但我的大部分代码是Ruby，即使jQuery使用snakeCase，遵守Ruby约定也是很有意义的。范围变量在所有动态语言中都很困难，而且在行为上常常令人惊讶。不过，这让我觉得很烦人，所以我不得不把问题贴出来。