如何将这三个函数重构为一个?

时间:2011-03-05 04:25:50

标签: javascript jquery refactoring

只有一条线的差异,并且想知道它是否完全可能!

function sortHot() {
    var order = [];

    $("#container").children(".submission-preview").each(
        function() {
            var key = $(this).attr('id');

            var value = $("div#" + key.replace("sub", "votes")).html() * key.replace("sub", "");

            order.push([key, value]);
        }
    );

    return order;
}

function sortNew() {
    var order = [];

    $("#container").children(".submission-preview").each(
        function() {
            var key = $(this).attr('id');

            var value = key.replace("sub", "");

            order.push([key, value]);
        }
    );

    return order;
}

function sortTop() {
    var order = [];

    $("#container").children(".submission-preview").each(
        function() {
            var key = $(this).attr('id');

            var value = $("div#" + key.replace("sub", "votes")).html();

            order.push([key, value]);
        }
    );

    return order;
}

4 个答案:

答案 0 :(得分:4)

概括键值转换的一种更“实用”的方法是包装一个通用的排序函数,该函数接受一个回调参数,用于在键上应用该转换。例如:

function sortGeneric(callback) {
    var order = [];
    $("#container").children(".submission-preview").each(function() {
        var key = $(this).attr('id');
        var value = callback(key);
        order.push([key, value]);
    });
    return order;
}

function sortHot() {
    return sortGeneric(function (key) {
        return $("div#" + key.replace("sub", "votes")).html() * key.replace("sub", "");
    });
}

function sortNew() {
    return sortGeneric(function (key) {
        return key.replace("sub", "");
    });
}

function sortTop() {
    return sortGeneric(function (key) {
        return $("div#" + key.replace("sub", "votes")).html();
    });
}

答案 1 :(得分:3)

您可以使用switch并将参数传递给函数:

function sortBy(sortOption) {
    var order = [];

    $("#container").children(".submission-preview").each(
        function() {
            var key = $(this).attr('id');
            var value;

            switch (sortOption) {
                case "hot":
                    value = $("div#" + key.replace("sub", "votes")).html() * key.replace("sub", "");
                    break;

                case "new":
                    value = key.replace("sub", "");
                    break;

                case "top":
                    value = $("div#" + key.replace("sub", "votes")).html();
                    break;

                // You may want to provide a default case here, or
                // have one of the above options be the default
            }

            order.push([key, value]);
        }
    );

    return order;
}

然后将其称为三个相应的选项:

sortBy("hot");
sortBy("new");
sortBy("top");

答案 2 :(得分:1)

如果要保留函数名称,可以将除了不同行之外的所有内容移动到函数中,并使用返回值的函数调用它。

您可以使用map方法代替each,因为它用于从jQuery结果创建数组:

function sort(f) {
  return $("#container").children(".submission-preview").map(
    function() {
      var key = $(this).attr('id');
      return [key, f(key)];
    }
  ).get();
}

function sortHot() {
  return sort(function(key){
    return $("div#" + key.replace("sub", "votes")).html() * key.replace("sub", "");
  });
}

function sortNew() {
  return sort(function(key){
    return key.replace("sub", "");
  });
}

function sortTop() {
  return sort(function(key){
    return $("div#" + key.replace("sub", "votes")).html();
  });
}

如果您想拥有单一功能,那么您可以重复使用相同值的不同行的部分:

function sort(mode) {
  return $("#container").children(".submission-preview").map(
    function() {
      var key = $(this).attr('id');
      var value = key.replace("sub", "");
      if (mode != 'New') {
        var html = $("div#" + key.replace("sub", "votes")).html();
        value = mode == 'Hot' ? html * value : html;
      }
      return [key, value];
    }
  ).get();
}

答案 3 :(得分:0)

您可以添加参数并执行if语句

function sortTop(type) {
    var order = [];

    $("#container").children(".submission-preview").each(
        function() {
            var key = $(this).attr('id');

            if(type == 'top'){
               var value = $("div#" + key.replace("sub", "votes")).html();
            }else  if(type == 'hot'){
               var value = $("div#" + key.replace("sub", "votes")).html() * key.replace("sub", "");
            }else{
               var value = key.replace("sub", "");

            }

            order.push([key, value]);
        }
    );

    return order;
}