- JavaScript Basics
- JavaScript Tutorial
- JavaScript: where to write
- JavaScript: how to display
- JavaScript: keywords
- JavaScript: comments
- JavaScript: variables
- JavaScript: operators
- JavaScript: data types
- JavaScript Conditional Statements
- JavaScript: if-else
- JavaScript: switch
- JavaScript: for loop
- JavaScript: while loop
- JavaScript: do-while loop
- JavaScript: break and continue
- JavaScript Popup Boxes
- JavaScript: alert box
- JavaScript: confirm box
- JavaScript: prompt box
- JavaScript Popular Topics
- JavaScript: functions
- JavaScript: innerHTML
- JavaScript: getElementById()
- JavaScript: getElementsByClassName()
- JavaScript: getElementsByName()
- JavaScript: getElementsByTagName()
- JavaScript: querySelector()
- JavaScript: querySelectorAll()
- JavaScript: document.write()
- JavaScript: console.log()
- JavaScript: boolean
- JavaScript: events
- JavaScript: Math object
- JavaScript: Math.random()
- JavaScript: Number()
- JavaScript: parseInt()
- JavaScript: parseFloat()
- JavaScript Arrays
- JavaScript: array
- JavaScript: find length of array
- JavaScript: add element at beginning
- JavaScript: add element at end
- JavaScript: remove first element
- JavaScript: remove last element
- JavaScript: get first index
- JavaScript: get last index
- JavaScript: reverse an array
- JavaScript: sort an array
- JavaScript: concatenate arrays
- JavaScript: join()
- JavaScript: toString()
- JavaScript: from()
- JavaScript: check if value exists
- JavaScript: check if array
- JavaScript: slice an array
- JavaScript: splice()
- JavaScript: find()
- JavaScript: findIndex()
- JavaScript: entries()
- JavaScript: every()
- JavaScript: fill()
- JavaScript: filter()
- JavaScript: forEach()
- JavaScript: map()
- JavaScript Strings
- JavaScript: string
- JavaScript: length of string
- JavaScript: convert to lowercase
- JavaScript: convert to uppercase
- JavaScript: string concatenation
- JavaScript: search()
- JavaScript: indexOf()
- JavaScript: search() vs. indexOf()
- JavaScript: match()
- JavaScript: match() vs. search()
- JavaScript: replace()
- JavaScript: toString()
- JavaScript: String()
- JavaScript: includes()
- JavaScript: substr()
- JavaScript: slice string
- JavaScript: charAt()
- JavaScript: repeat()
- JavaScript: split()
- JavaScript: charCodeAt()
- JavaScript: fromCharCode()
- JavaScript: startsWith()
- JavaScript: endsWith()
- JavaScript: trim()
- JavaScript: lastIndexOf()
- JavaScript Date and Time
- JavaScript: date and time
- JavaScript: Date()
- JavaScript: getFullYear()
- JavaScript: getMonth()
- JavaScript: getDate()
- JavaScript: getDay()
- JavaScript: getHours()
- JavaScript: getMinutes()
- JavaScript: getSeconds()
- JavaScript: getMilliseconds()
- JavaScript: getTime()
- JavaScript: getUTCFullYear()
- JavaScript: getUTCMonth()
- JavaScript: getUTCDate()
- JavaScript: getUTCDay()
- JavaScript: getUTCHours()
- JavaScript: getUTCMinutes()
- JavaScript: getUTCSeconds()
- JavaScript: getUTCMilliseconds()
- JavaScript: toDateString()
- JavaScript: toLocaleDateString()
- JavaScript: toLocaleTimeString()
- JavaScript: toLocaleString()
- JavaScript: toUTCString()
- JavaScript: getTimezoneOffset()
- JavaScript: toISOString()
- JavaScript Regular Expression
- JavaScript: regular expression
- JavaScript: RegEx . (dot)
- JavaScript: RegEx \w and \W
- JavaScript: RegEx \d and \D
- JavaScript: RegEx \s and \S
- JavaScript: RegEx \b and \B
- JavaScript: RegEx \0
- JavaScript: RegEx \n
- JavaScript: RegEx \xxx
- JavaScript: RegEx \xdd
- JavaScript: RegEx quantifiers
- JavaScript: RegEx test()
- JavaScript: RegEx lastIndex
- JavaScript: RegEx source
- JavaScript Programs
- JavaScript Programs
JavaScript findIndex(): Get the index of the first element that meets the condition
The JavaScript findIndex() method is similar to the find() method, except that it returns the index number of an element instead of the element itself. That is, the findIndex() method returns the index number of the first element from a given array that satisfies the given condition. For example:
<!DOCTYPE html> <html> <body> <p>The first even value is at Index Number: <span id="xyz"></span></p> <script> const numbers = [13, 32, 43, 54, 40]; let firstEvenNumIndex = numbers.findIndex(findFirstEvenIndx); function findFirstEvenIndx(x) { return x%2==0; } document.getElementById("xyz").innerHTML = firstEvenNumIndex; </script> </body> </html>
The first even value is at Index Number:
However, you can also access the value itself using the returned index number. For example:
<!DOCTYPE html> <html> <body> <p>The first even number is: <span id="abc"></span></p> <script> const arr = [13, 32, 43, 54, 40]; let fi = arr.findIndex(findFE); function findFE(x) { return x%2==0; } document.getElementById("abc").innerHTML = arr[fi]; </script> </body> </html>
The first even number is:
Note: Indexing starts with 0. Therefore, index number 1 refers to the second element, not the first.
JavaScript findIndex() syntax
The syntax of the findIndex() method in JavaScript is:
array.findIndex(functionName(currentElementValue, currentElementIndex, currentElementArray), thisValue)
The functionName and currentElementValue are required.
Note: The functionName refers to a function to execute for every element of the array until the given condition inside the function is satisfied.
Note: The currentElementValue basically refers to a variable that will be used as an argument to the function and that, of course, indicates the current value or element of the specified array.
Note: The currentElementIndex refers to the index of the current element.
Note: The currentElementArray refers to the array of the current element.
Note: The thisValue refers to a value passed to the specified function functionName as its this value. The default value is undefined.
The findIndex() method returns -1 if no elements from the given array satisfy the given condition. For example:
<!DOCTYPE html> <html> <body> <script> const myarray = [13, 33, 45]; let firstEvnNmIdx = myarray.findIndex(myfunction); function myfunction(x) { return x%2==0; } if(firstEvnNmIdx == -1) console.log("Even number not found!"); else console.log("The first even number is: ", myarray[firstEvnNmIdx]); </script> </body> </html>
The snapshot given below shows the sample output produced by the above example:
« Previous Tutorial Next Tutorial »