Open In App

How to get index of object inside an array that matches the condition in jQuery ?

Improve
Improve
Like Article
Like
Save
Share
Report

jQuery is a free and open-source JavaScript library designed to add interactivity to the HTML web pages. jQuery is similar to JavaScript in terms of functionality but what makes it popular is its simplicity and ease of use. jQuery comes bundles with inbuilt methods that help achieve the desired output. In this article, we will discuss the two methods in jQuery that can be used to get the index of an object inside an array that matches the given condition. The two methods are discussed as follows.

  1. findIndex(): This method executes the function passed as a parameter for each element present in the array.
    • Syntax:
      array.findIndex(function(curr, index, arr), thisVal)
    • Parameter:
      • curr: Current element of the array on which the function will be executed. This is
        mandatory parameter.
      • index: Index of the current element. This is optional parameter.
      • arr: Array to which the current element belongs. This is optional parameter.
      • thisVal: This value is passed to the function as its “this” value. If this parameter is
        not specified, the value “undefined” is passed as “this” value. This parameter is optional.
    • Return value: This method returns the index of the first element for which the return
      value of the function is true. If no match is found it returns -1. If there is more than one element that
      fulfills the criteria then the index of the first matched element is returned.
  2. some(): The arr.some() method checks whether at least one of the elements of the array satisfies the condition checked by the argument method.
    • Syntax:
      array.some(function(curr, index, arr), thisval)
    • Parameter:
      • curr: Current element of the array on which the function will be executed. This is
        mandatory parameter.
      • index: Index of the current element. This is optional parameter.
      • arr: Array to which the current element belongs. This is optional parameter.
      • thisVal: This value is passed to the function as its “this” value. If this parameter is
        not specified, the value “undefined” is passed as “this” value. This parameter is optional.
    • Return value: This method returns the index of the first element for which the return
      value of the function is “true”. If no match is found it returns -1. If there is more than one element that
      fulfills the criteria then the index of the first matched element is returned.

Approach 1: In the first approach, we show the procedure for finding the index of an object in an array that matches a given condition using the findIndex() method of jQuery. The findIndex() method takes a function as the first parameter. This function is executed on every element of the array and the element for which the function returns “true” is the one that matched the specified condition. Thus the index of this matched element is stored in the index variable. The value of the index variable is returned to the console. Similarly, for the index1 variable, there is more than one object having age=”20″. In this situation, the index of the first matched object is returned. If no match is present then the output is -1.




// Write JavaScript code here
var arr = [
    { name: "ram", age: "20" }, 
    { name: "sam", age: "20" },
    { name: "tom", age: "19" }, 
    { name: "harry", age: "19" }
];
  
var index;
  
arr.findIndex(function (entry, i) {
    if (entry.name == "tom") {
        index = i;
        return true;
    }
});
  
// Arrow function expression ( =>) is 
// an alternative to a traditional 
// function expression
// It has limited use and returns the
// index of the first element for 
/// which the function returns "true"
index1 = arr.findIndex(x => x.age === "20");
  
console.log(index);
console.log(index1); 


Output:

 2
 0

Approach 2: In the second approach, we show the procedure for finding the index of an object in an array that matches a given condition using the some() method of jQuery. The some() method takes a function as the first parameter. This function is executed on every element of the array and the element for which the function returns “true” is the one that matched the specified condition. Thus the index of this matched element is stored in the index variable. The value of the index variable is returned to the console.




// Write Javascript code here
var arr = [
    { name: "ram", age: "20" }, 
    { name: "sam", age: "21" },
    { name: "tom", age: "19" }, 
    { name: "harry", age: "19" }
];
  
var index;
  
arr.some(function (entry, i) {
    if (entry.name == "tom") {
        index = i;
        return true;
    }
});
  
console.log(index);


Output:

 2


Last Updated : 15 Oct, 2020
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads