【问题标题】:Pure JS to lodash纯 JS 到 lodash
【发布时间】:2015-02-06 23:44:37
【问题描述】:

我在这里有一些不同的陈述,如果它们是等价的,我希望你告诉我:

myApp.filter('myFilter', function() {

  var result, i, sport, y, contains, league;
  return function(sports, filterBy) {    
    if (angular.isUndefined(sports) || !filterBy) {
      return sports;
    }

    filterBy = filterBy.toLowerCase();
    result = [],
    contains = function(haystack, needle) {
      return haystack.toLowerCase().indexOf(needle) > -1;
    };

    for (i = 0; i < sports.length; i++) {
      sport = sports[i];
      if (contains(sport.name, filterBy)) {
        result.push(sport);
        continue;
      } else {
        for (y = 0; y < sport.leagues.length; y++) {
          league = sport.leagues[y];
          if (contains(league.name, filterBy)) {
            result.push(sport);
            break;
          }
        }
      }
    }
    return result;
  };
});

现在使用 lodash:

myApp.filter('myFilter', function() {

  var result, i, sport, y, contains, league;
  return function(sports, filterBy) {    
    if (angular.isUndefined(sports) || !filterBy) {
      return sports;
    }

    filterBy = filterBy.toLowerCase();
    result = [],
    contains = function(haystack, needle) {
      return haystack.toLowerCase().indexOf(needle) > -1;
    };

  _.each(sports.length, function(sport) {
      if (contains(sport.name, filterBy)) {
        result.push(sport);
        continue;
      } else {
        _.each(sport.leagues.length, function(league) {
          if(contains(league.name, filterBy)) {
            result.push(sport);
            break;
          }
        });
      }
    });

我只是想了解 lodash 的逻辑。我在几乎纯 JS 中具有该功能,但是一旦我尝试将其翻译为 lodash,我的应用程序就崩溃了,所以我想知道错误在哪里?

这里我有带有纯js函数的this Plnkr,在库部分你会看到我有underscore,因为我不知道为什么lodash没有加载,所以,我正在尝试的是:翻译使用 _.each 而不是 for loop 将该函数转换为 lodash 函数

【问题讨论】:

  • 在两种情况下都从第一个参数中删除.length
  • 一个 each 和一个 push 到一个新的空数组几乎总是一个 map - 无论是在原生 JS 还是在 lodash 中。
  • 我没有得到你@BenjaminGruenbaum,你能给一个代码示例吗?
  • @NietzscheProgrammer plnkr.co/edit/3eemdNxpdKdJV5YNy9Lg?p=preview 没有下划线,将整个过滤方法减少到 ±8 行。

标签: javascript angularjs underscore.js lodash


【解决方案1】:

在这种情况下,您不会使用“每个”。同样在“每个”中,您不会得到“继续”或“中断”。对我来说,我会使用“过滤器”来获得过滤后的结果。所以代码应该是这样的:

var result = sports.filter(function(sport){
  return (
      contains(sport.name, filterBy) 
    || (
      sport.leagues && sport.leagues.some(function(league) { 
        return contains(league.name, filterBy) 
      })
    )
  )
})

或用于 lodash/下划线

var result = _.filter(sports, function(sport) {
  return (
      contains(sport.name, filterBy) 
    || (
      sport.leagues && _.some(sport.leagues, function(league) { 
        return contains(league.name, filterBy);
      })
    )
  )
});

【讨论】:

  • 你的内部.filter()sport.leagues 应该以.length 结尾,因为它总是返回一个数组,它总是真实的。实际上,.some().filter() 更有意义,因为它返回一个布尔值并在满足条件时立即中断迭代。
  • 好收获。我可以解决这个问题。
  • 我正在查看您的 plnkr plnkr.co/edit/3eemdNxpdKdJV5YNy9Lg?p=preview,但没有发现问题。你能指出问题出在哪里吗?是否缺少扫描“league”属性中的“sport”对象?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-05-09
  • 2018-10-11
  • 2017-06-27
  • 1970-01-01
  • 1970-01-01
  • 2018-03-23
相关资源
最近更新 更多