如何在JavaScript中找到匹配布尔条件的数组的第一个元素？

Question

我想知道是否有一种已知的,内置/优雅的方法来查找匹配给定条件的JS数组的第一个元素.AC#等价物将是List.Find.

到目前为止,我一直在使用这样的双功能组合:

// Returns the first element of an array that satisfies given predicate
Array.prototype.findFirst = function (predicateCallback) {
    if (typeof predicateCallback !== 'function') {
        return undefined;
    }

    for (var i = 0; i < arr.length; i++) {
        if (i in this && predicateCallback(this[i])) return this[i];
    }

    return undefined;
};

// Check if element is not undefined && not null
isNotNullNorUndefined = function (o) {
    return (typeof (o) !== 'undefined' && o !== null);
};

然后我可以使用:

var result = someArray.findFirst(isNotNullNorUndefined);

但是由于ECMAScript中存在如此多的函数式数组方法,或许还有类似的东西吗？我想很多人都要一直这样实现这样的东西......

Answer 1

从ES6开始,存在数组的本机find方法.

我必须发布一个答案来阻止这些filter建议:-)

因为在ECMAScript中有这么多功能样式的数组方法,或许已经有这样的东西了吗？

您可以使用someArray方法迭代数组,直到满足条件(然后停止).不幸的是,它只会返回条件是否满足一次,而不是通过哪个元素(或在什么索引处)满足.所以我们要修改一下:

const result = someArray.find(isNotNullNorUndefined);

Answer 2

从ECMAScript 6开始,您可以使用Array.prototype.find它.这是在Firefox(25.0),Chrome(45.0),Edge(12)和Safari(7.1)中实现和使用的,但不适用于Internet Explorer或其他一些旧的或不常见的平台.

例如,下面的表达式求值为106.

[100,101,102,103,104,105,106,107,108,109].find(function (el) {
    return el > 105;
});

如果您现在要使用此功能但需要支持IE或其他不支持的浏览器,则可以使用填充程序.我推荐es6-shim.如果由于某种原因您不想将整个es6-shim放入您的项目中,MDN也会提供垫片.为了获得最大的兼容性,你需要es6-shim,因为它与MDN版本不同,它检测错误的本机实现find并覆盖它们(请参阅开头的注释"解决Array#find和Array#findIndex中的错误"以及紧随其后的行) .

Answer 3

如何使用过滤器并从结果数组中获取第一个索引？

var result = someArray.filter(isNotNullNorUndefined)[0];

Answer 4

现在应该很清楚JavaScript本身没有提供这样的解决方案; 这里是最接近的两个衍生物,最有用的第一个:

1. Array.prototype.some(fn)提供满足条件时所需的停止行为,但仅返回元素是否存在; 应用一些技巧并不难,比如Bergi的答案所提供的解决方案.

2. Array.prototype.filter(fn)[0]是一个伟大的单线,但效率最低,因为你扔掉N - 1元素只是为了得到你需要的东西.

JavaScript中的传统搜索方法的特征在于返回找到的元素的索引而不是元素本身或-1.这避免了必须从所有可能类型的域中选择返回值; 索引只能是数字而负值无效.

上面的两个解决方案都不支持偏移搜索,所以我决定写这个:

(function(ns) {
  ns.search = function(array, callback, offset) {
    var size = array.length;

    offset = offset || 0;
    if (offset >= size || offset <= -size) {
      return -1;
    } else if (offset < 0) {
      offset = size - offset;
    }

    while (offset < size) {
      if (callback(array[offset], offset, array)) {
        return offset;
      }
      ++offset;
    }
    return -1;
  };
}(this));

search([1, 2, NaN, 4], Number.isNaN); // 2
search([1, 2, 3, 4], Number.isNaN); // -1
search([1, NaN, 3, NaN], Number.isNaN, 2); // 3

Answer 5

如果你正在使用,underscore.js你可以使用它find和indexOf函数来获得你想要的东西:

var index = _.indexOf(your_array, _.find(your_array, function (d) {
    return d === true;
}));

文档:

• http://underscorejs.org/#find
• http://underscorejs.org/#indexOf

Answer 6

摘要：

• 为了找到匹配布尔条件的数组中的第一个元素，我们可以使用 ES6 find()
• find()位于上，Array.prototype因此可以在每个阵列上使用。
• find()接受boolean测试条件的回调。该函数返回值（不是索引！）

例：

const array = [4, 33, 8, 56, 23];

const found = array.find((element) => {
  return element > 50;
});

console.log(found);   //  56

Answer 7

从 ES 2015 开始，Array.prototype.find()提供了这种确切的功能。

对于不支持此功能的浏览器，Mozilla 开发者网络提供了一个polyfill（粘贴在下面）：

if (!Array.prototype.find) {
  Array.prototype.find = function(predicate) {
    if (this === null) {
      throw new TypeError('Array.prototype.find called on null or undefined');
    }
    if (typeof predicate !== 'function') {
      throw new TypeError('predicate must be a function');
    }
    var list = Object(this);
    var length = list.length >>> 0;
    var thisArg = arguments[1];
    var value;

    for (var i = 0; i < length; i++) {
      value = list[i];
      if (predicate.call(thisArg, value, i, list)) {
        return value;
      }
    }
    return undefined;
  };
}