JavaScript filter that stops at the first result

Question

Is there a mechanism in JavaScript (without having to write my own) similar to filter . Instead of returning all the filtered elements of a collection though, it only returns the first one. Of course I could do the following to get the first even number:

[7,5,3,2,1].filter(x => x % 2 == 0)[0]

But if there were 10 million more numbers in that list, there'd be a lot of unnecessary work. In a language like Haskell, the other 10 million numbers wouldn't be looked at due to lazy evaluation.

Is there a mechanism in JavaScript to do the above without evaluating any elements after the first result?

Answer 1

You can try .find :

[7,5,3,2,1].find(x => x % 2 == 0);
// result: 2

From the docs :

The find() method returns a value of the first element in the array that satisfies the provided testing function. Otherwise undefined is returned.

Simple benchmark

var arr = [...Array(10000)].map( (item, idx) => idx )

arr.filter(i => i == 3000)[0]
arr.find(i => i == 3000)

/*
  arr.filter x 1,358 ops/sec ±0.40% (91 runs sampled)
  arr.find x 23,743 ops/sec ±0.40% (90 runs sampled)
  Fastest is arr.find
*/

Answer 2

I think Array.prototype.find() accomplishes this - it will retrieve the first element in an array that matches a certain criteria:

[7, 5, 3, 2, 1].find(isEvenNumber); //2

function isEvenNumber(elem) {
  return elem % 2 === 0;
}

Answer 3

The solution is to use .find()

Note: The find() method is not supported in IE 11 (and earlier versions) !