如何重构一段用 jQuery/Coffeescript 编写的功能代码以实现可重用性答案

【问题标题】：How to refactor a functioning piece of code written in jQuery/Coffeescript for reusability如何重构一段用 jQuery/Coffeescript 编写的功能代码以实现可重用性
【发布时间】：2011-12-04 19:06:35
【问题描述】：

以下代码适用于我：

  $ ->
    $("[id$=\"_phase_id\"]").change(->
      common_prefix = "type_well_type_well_phases_attributes_"
      cell_pos = $(this).attr("id").match(/\d+/g)
      mult = "#" + common_prefix + cell_pos + "_multiplier"
      mol  = $("#" + common_prefix + cell_pos + "_mol_percent").val()
      gpm  = "#" + common_prefix + cell_pos + "_GPM"
      component_id = $(this).val()
      $.getJSON('/phases/' + component_id, (data) ->
        pressure_base = 0.0
        if $("#type_well_pressure_base").val() == "14.65"
          pressure_base = data.base1
        else if $("#type_well_pressure_base").val() == "14.696"
          pressure_base = data.base2
        else if $("#type_well_pressure_base").val() == "14.73"
          pressure_base = data.base3
        else if $("#type_well_pressure_base").val() == "15.025"
          pressure_base = data.base4
        mult_value = parseFloat(pressure_base)
        $(mult).val mult_value
        $(gpm).val bcr_round_to(mult_value * (mol / 100.0), 4) if (mol != "")
      )
    ).trigger "change"

这是遍历我的 Rails 代码中的嵌套表单 (phase_attributes) 以根据在我的父表单 (type_well) 中选择的值 (presure_base 下拉列表) 调用 json，然后计算嵌套表单的值 (gpm) .如您所见，如果阶段下拉菜单中的阶段“更改”，我从数据库中获取相应的行并根据 pressure_base 的值（14.65、14.696、14.73、15.025），计算“gpm”值.一切正常。

现在，我尝试将其添加为在用户更改“pressure_base”本身时自动重新计算嵌套表单的“gpm”值的功能。显然，我必须遍历嵌套行（我知道怎么做，所以这没问题），并且基本上对每个嵌套行再次重复该过程。这里唯一的变量是“cell_pos”。有什么方法可以提取从循环中重复调用的从属 jQuery/Coffeescript 函数？我知道如何在 Ruby/Rails 中做到这一点，因为我对它很熟悉，但对 jQuery 的经验较少（甚至对 Coffeescript 的经验更少）。

【问题讨论】：

标签： jquery ruby-on-rails coffeescript

【解决方案1】：

如果我理解正确，您应该使用#type_well_pressure_base 上的change 事件重新计算gpm 值。然后您可以使用 getJSON 回调来更改存储的值并触发计算。

phase = $('[id$="_phase_id"]')
phase.change ->
    self = $(this)
    common_prefix = "type_well_type_well_phases_attributes_"

    cell_pos = self.attr('id').match(/\d+/g)
    component_id = self.val()

    cell = "##{common_prefix}#{cell_pos}"
    mult = "#{cell}_multiplier"
    gpm  = "#{cell}_GPM"

    mol  = $("#{cell}_mol_percent").val()

    $.getJSON("/phases/#{component_id}", (data) ->
        pressure.base.data 'pb_data', data
        pressure_base.trigger 'change'

base_values =
    '14.65'  : 'base1'
    '14.696' : 'base2'
    '14.73'  : 'base3'
    '15.025' : 'base4'

pressure_base = $('#type_well_pressure_base')
pressure_base.change ->
    data = $(this).data 'pb_data'
    type_well_pb = pressure_base.val()
    base = base_values[type_well_pb]
    mult_value = parseFloat(data[base])
    $(mult).val mult_value
    $(gpm).val bcr_round_to(mult_value * (mol / 100.0), 4) if (mol != "")

phase.trigger 'change'

【讨论】：