coffeescript jQuery - 如何重构这个（菜鸟）方法？

Question

在开始学习一些编码之后，我在 rails4 应用程序中使用引导程序进行了这个（非常丑陋，非 DRY）星级切换。我已经完成了代码学校的咖啡脚本教程，但似乎 ruby​​ 对我来说更容易学习。

如果有人能提供一些“专业人士”如何编写此函数的提示？ 非常感谢。

@starSwitch =  ->
    label_1 = $("label#1")
    label_2 = $("label#2")
    label_3 = $("label#3")
    label_4 = $("label#4")
    label_5 = $("label#5")

    label_1.click ->
            label_1.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_2.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")
            label_3.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")
            label_4.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")
            label_5.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")

    label_2.click ->
            label_1.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_2.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_3.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")
            label_4.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")
            label_5.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")

    label_3.click ->
            label_1.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_2.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_3.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_4.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")
            label_5.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")

    label_4.click ->
            label_1.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_2.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_3.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_4.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_5.children("i").addClass("icon-star-empty").removeClass("icon-star colorfull")

    label_5.click ->
            label_1.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_2.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_3.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_4.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")
            label_5.children("i").addClass("icon-star colorfull").removeClass("icon-star-empty")

$ -> starSwitch

Answer 1

你可以这样做：

@starSwitch =  ->
  $("label").click ->
    $("label").addClass("icon-star colorfull").removeClass("icon-star-empty")
    $(this).nextAll("label").addClass("icon-star-empty").removeClass("icon-star colorfull")

如果页面上有其他标签，请在星标签中添加一个类（例如stars），然后将代码更改为$("label.stars").click 和nextAll("label.stars")。