2

アブストラクトであるアイテムのリストがあり、クリックすると 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')

これは滑らかな Coffeescript のようには読めず、「どうすればよかったのか」と考えていることに気づきますが、特に、current_open_rowクリック ハンドラーのスコープ外で変数をインスタンス化するのは奇妙に感じます。もちろん、これを行わないと、ハンドラーへのエントリ時に新しいインスタンス化が発生しますが、これは常に未定義です。

変数へのリファクタリング以外$(this).attr('id')に、醜い、最適ではない、判読できないなどの理由で飛び出すものはありますか?

ありがとう！

4

1 に答える 1

2

まず最初に、最終的にキャメルケースに切り替えることになると思います... 多くの人が readability_of_underscores を強く好むことは知っていますが、やり取りするすべてのライブラリ (jQuery を含む) はキャメルケースを使用します。心に留めておくべきことがあります。

それはさておき、変数のスコープを設定しなければならないという問題は= null良い問題です。私は Jeremy に、より適切なスコープ構文があるべきだと説得しようとしましたが、彼は固く反対しています。したがって、変数をオブジェクト プロパティに移動することをお勧めします。幸いなことに、これは jQuery であるため、データを貼り付ける場所はたくさんあります。リストの.dataメソッドを使用するのはどうですか? これには追加の利点があります。将来、複数のリストでこれを行う場合 (current_open_row各リストに 1 つ)、コードを少し変更する必要はありません。子を持つリストをマークアップに追加するだけ.faq-itemです。

postもう 1 つのマイナー ポイント:呼び出しにコールバックを与える

(data) -> replace_items data

それだけなら、replace_items直接渡してみませんか？:)

また、読みやすくするために、関数の各引数をpost独自の行に配置します。キーと値のペアは、中括弧がなくても、自動的に 1 つのオブジェクトに結合されます。すべての外観は次のとおりです。

$('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
于 2011-04-29T18:52:18.527 に答える