【问题标题】:Simplify my function (loop, array)?简化我的函数(循环、数组)?
【发布时间】:2014-12-12 02:39:05
【问题描述】:

我有一个重复几次的函数,我相信可以简化并从数组中发送变量。

var i = masterdata.timing.split(',');
        var index = 0;
        for (index = 0; index < i.length; ++index) {
            $("#timing_" + i[index].trim()).prop('checked', true);
        }

    var i = masterdata.concern.split(',');
    var index = 0;
    for (index = 0; index < i.length; ++index) {
        $("#concern_" + i[index].trim()).prop('checked', true);
    }

    var i = masterdata.steps.split(',');
    var index = 0;
    for (index = 0; index < i.length; ++index) {
        $("#steps_" + i[index].trim()).prop('checked', true);
    }

也许只是将类别更改为变量并从数组中发送类别?

var chkgroup = [
            'timing, concern, steps'
        ]

【问题讨论】:

    标签: javascript jquery arrays function loops


    【解决方案1】:

    你的想法应该可以正常工作:

    var i;
    var index = 0;
    var j = 0;
    var chkgroup = ['timing', 'concern', 'steps'];
    var currentGroup;
    
    for (j = 0; j < chkgroup.length; ++j) {
        currentGroup = chkgroup[j];
    
        i = masterdata[currentGroup].split(',');
    
        for (index = 0; index < i.length; ++index) {
            $("#" + currentGroup + "_" + i[index].trim())
                .prop('checked', true);
        }        
    }
    

    如果chkgroup 数组确实与masterdata 中的对象keys 匹配,则可以使用外部for..in 循环代替:

    var i;
    var index = 0;
    var currentGroup;
    
    for (currentGroup in masterdata) {
        i = masterdata[currentGroup].split(',');
    
        for (index = 0; index < i.length; ++index) {
            $("#" + currentGroup + "_" + i[index].trim())
                .prop('checked', true);
        }        
    }
    

    请注意,for...in 没有定义顺序,因此如果您需要保证以特定顺序迭代对象属性,最好使用预定义数组。

    你也可以喜欢$.map

    var values = $.map(masterdata, function (i, currentGroup) {
        return $.map(i.split(','), function (val) {
            return $('#' + currentGroup + '_' + val.trim());
        });
    });
    
    $(values).prop('checked', true);
    

    【讨论】:

    • 在 var i 中,masterdata.timing 随类别而变化。
    • @triplethreat77:已更新,请查看
    【解决方案2】:
    var chkgroup = [ 'timing', 'concern', 'steps' ];
    
    setProps( chkgroup, masterdata );
    
    function setProps( c, m ) {
        $.each(c, function(i, group) {
            var i = m[group]split(',');
            var index = 0;
            for (index = 0; index < i.length; ++index) {
                $("#" + group + "_" + i[index].trim()).prop('checked', true);
            }
        });
    }
    

    【讨论】:

      【解决方案3】:

      事实上,您的代码仍然有点嘈杂且不可读,即开发人员必须花费至少几分钟来分析它以了解逻辑是否正确。使用 loDash 或 Underscore,您的代码可以简化为:

         var selector = _.chain(masterdata)
              //pick only needed items 
              .pick(masterdata, 'timing', 'concern', 'steps')
              .map(function (item, key) {
                  //split and transform the string into selector, e.g. #timing_1
                  var ids = item.split(',');
                  var mapped = _.map(ids, function (id) { return "#" + key + "_" + id.trim(); });
                  return mapped.join();
              })
              .value()
              .join();
          $(selector).prop('checked', true);
      

      jsfiddle 上的工作示例

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2020-06-26
        • 1970-01-01
        • 2013-11-15
        • 1970-01-01
        • 2014-10-18
        • 2023-04-07
        相关资源
        最近更新 更多