DEV Community

Kelvin Wangonya
Kelvin Wangonya

Posted on

Finding an element in the array (the ES5, ES6 and ES7 way)

#javascript #webdev #arrays #beginners

This'll be a quick one.

Say you want to check if a specific element exists in an array. There's a couple of ways to do that:

ES5

indexOf()

indexOf returns the index of the first matching item found, or -1 if not found.

// check if a Fortnite ninja exists in the array const ninjas = ['Alchemist', 'Brawler', 'Skirmisher', 'Harvester'] console.log(ninjas.indexOf('Brawler')) // 1 console.log(ninjas.indexOf('Harvester')) // 3 console.log(ninjas.indexOf('Assassin')) // -1 (doesn't exist)
Enter fullscreen mode Exit fullscreen mode

lastIndexOf()

lastIndexOf() returns the index of the last matching item found, or -1 if not found.

// check if a Fortnite ninja exists in the array // note that 'Brawler' exists twice const ninjas = ['Alchemist', 'Brawler', 'Skirmisher', 'Harvester', 'Brawler', 'Stonefoot'] console.log(ninjas.lastIndexOf('Brawler')) // 4 (last one returned) console.log(ninjas.lastIndexOf('Harvester')) // 3 console.log(ninjas.lastIndexOf('Assassin')) // -1 (doesn't exist)
Enter fullscreen mode Exit fullscreen mode

ES6

find()

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

const ninjas = [ {name: 'Alchemist'}, {name: 'Brawler'}, {name: 'Skirmisher'}, {name: 'Harvester'} ] console.log(ninjas.find(ninja => ninja.name === 'Harvester')); // {name: "Harvester"} console.log(ninjas.find(ninja => ninja.name === 'Assassin')); // undefined
Enter fullscreen mode Exit fullscreen mode
findIndex()

Returns the index of the first element in the array that satisfies the provided testing function. Otherwise -1 is returned.

const ninjas = [ {name: 'Alchemist'}, {name: 'Brawler'}, {name: 'Skirmisher'}, {name: 'Harvester'} ] console.log(ninjas.findIndex(ninja => ninja.name === 'Harvester')); // 3 console.log(ninjas.findIndex(ninja => ninja.name === 'Assassin')); // -1
Enter fullscreen mode Exit fullscreen mode

ES7

includes()

The includes() method determines whether an array includes a certain element, returning true or false as appropriate. For example, a.includes(value) returns true if a contains value

const ninjas = ['Alchemist', 'Brawler', 'Skirmisher', 'Harvester'] console.log(ninjas.includes('Brawler')); // true console.log(ninjas.includes('Assassin')); // false
Enter fullscreen mode Exit fullscreen mode

a.includes(value, i) returns true if a contains value after (or at) the position i

const ninjas = ['Alchemist', 'Brawler', 'Skirmisher', 'Harvester'] console.log(ninjas.includes('Skirmisher', 1)); // true console.log(ninjas.includes('Skirmisher', 2)); // true console.log(ninjas.includes('Skirmisher', 3)); // false
Enter fullscreen mode Exit fullscreen mode

Let me know of any other interesting ways I may have missed :)

Top comments (0)