What To Do When You Don’t Care

(About Finding Items in Arrays)
[What Do You Care About?]

About Mike Frazier

Software Engineer @ ClickFox

Hack Reactor Remote

Former chemistry teacher

Recent skateboarder

Twitter: @AFrazGuy

DenverDevs: @frazier

Blog: mikedoescoding.com

some

findIndex

lastIndexOf

includes

indexOf

find

ES5

ES6+

Note About Examples

Examples for object arrays are parsing for specific key-value pairs

To compare object to object, a workaround is to "stringify" the objects and compare strings

Repl available with some examples: https://bit.ly/2Lj2ZPV

I just care about getting back the index of the item!

Array.prototype.indexOf
Array.prototype.lastIndexOf

Returns the index of the found item

Returns -1 if the item isn't found

Considerations

Works really well for primitive values
Uses a strict equality check (===)
Won't find NaN

Array.prototype.indexOf
Array.prototype.lastIndexOf

let arr = [ 1, 2, 3, 4, 5, 3, 6 ];

let foundIdx = arr.indexOf(3); // 2

let lastFoundIdx = arr.lastIndexOf(3); // 5

let idxNotFound = arr.indexOf(7); // -1

let arr2 = [ { id: 1 }, { id: 2 }, { id: 3 } ];

let willNotWork = arr2.indexOf({ id: 2 }); // -1

Array.prototype.findIndex

Return the index of the found item that passes the comparator function
Returns -1 if an item isn’t found

Considerations

Returns the first item that passes the comparator
Visits every index in the array -- even those without an assigned value
Have to explicitly check for NaN

Array.prototype.findIndex

let arr = [
  { id: 1, color: 'red' },
  { id: 2, color: 'blue' },
  { id: 3, color: 'green' },
];

let foundIdx = arr.findIndex(item => item.color === 'blue'); // 1

let notFoundIdx = arr.findIndex(item => item.id === 4); // -1

let arr2 = [ 'hearts', 'stars', 'horseshoes', 'clovers' ];

let starsIdx = arr2.findIndex(item => item === 'stars'); // 1

I just care about getting back the item!

Array.prototype.find

Returns the found item that passes the comparator function

Returns undefined if no item is found

Considerations

Returns the first item that passes the comparator
Visits every index in the array -- even those without an assigned value
Have to explicitly check for NaN

Array.prototype.find

let arr = [
  { id: 1, color: 'red' },
  { id: 2, color: 'blue' },
  { id: 3, color: 'green' },
];

let foundItem = arr.find(item => item.color === 'red'); 
  // { id: 1, color: red }

let notFoundItem = arr.find(item => item.id === 4); // undefined

let arr2 = [ 'hearts', 'stars', 'horseshoes', 'clovers' ];

let starsItem = arr2.find(item => item === 'stars'); // 'stars'

I just care that the item might exist!

Array.prototype.some

Returns true/false if any item in the array passes the comparator function

As soon as function returns truthy, loop is exited

Skips over indices without assigned values

Considerations

Changing values or adding indices are not tested/visited once some is invoked

Array.prototype.some

let arr = [
  { id: 1, color: 'red' },
  { id: 2, color: 'blue' },
  { id: 3, color: 'green' },
];

let foundItem = arr.some(item => item.color === 'red'); // true

let notFoundItem = arr.some(item => item.id === 4); // false

let arr2 = [ 'hearts', 'stars', 'horseshoes', 'clovers' ];

let starsItem = arr2.some(item => item === 'stars'); // true

Array.prototype.includes

Return true/false if the item is in the array

Uses SameValueZero algorithm for comparison

Considerations

Works really well for primitive values

Kind of like strict (===) equality
-0 / +0 are the same
NaN is NaN

Array.prototype.includes

let arr = [ 1, 2, 3, 4, 5, 3, 6, NaN ];

let found = arr.includes(3); // true

let notFound = arr.includes(7); // false

let nanFound = arr.includes(NaN); // true

let arr2 = [ { id: 1 }, { id: 2 }, { id: 3 } ];

let willNotWork = arr2.includes({ id: 2 }); // false