Open In App

Underscore.js _.where() Function

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Share
Report issue
Report

Underscore.js _.where() function is used to find all the elements that match the searching condition. Suppose to find all the student details of a class then apply the _.where() function to the list of all the sections and pass the condition as the section name. So, the names of all the students in that specific section will be displayed.

Syntax: 

_.where( list, [predicate], [context] );

Parameters:

  • List: This parameter is used to hold the list of data.
  • Predicate: This parameter is used to hold the test condition.
  • Context: The text that needs to be displayed.

Return values:

This function returns an array containing all the elements that match the given condition along with their full details.

Difference between _.findWhere() and _.where() function: Both the functions take an array name and the property to match but the _.where() function displays all the matches whereas, _.findWhere) function matches only the first match.

Passing an array to the _.where() function:

The ._where() function takes the elements from the list one by one and matches the specified condition on the element’s details. It will check for those elements which will have ‘true’ in the ‘hasLong’ property. After traversing and checking all the elements, the _.where() function ends. The array of all the elements with this property will be displayed.

Example: In this example, we are passing an array to the _.where() function.

HTML




<html>
 
<head>
    <title>_.where() function</title>
    <script type="text/javascript" src=
    </script>
    <script type="text/javascript" src=
    </script>
</head>
 
<body>
    <script type="text/javascript">
        let people = [
            { "name": "sakshi", "hasLong": "false" },
            { "name": "aishwarya", "hasLong": "true" },
            { "name": "akansha", "hasLong": "true" },
            { "name": "preeti", "hasLong": "true" }
        ]
        console.log(_.where(people, { hasLong: "true" }));
    </script>
</body>
 
</html>


Output: 

Passing a list of elements with a number of properties to _.where() function:

Firstly, declare the whole list with all the properties of each element mentioned and then pass the array name along with the property on the basis of which need to match the elements to the _.where() function. It will traverse the whole list and display the details of all the elements which match the given condition.

Example: In this example, we are passing a list of elements with a number of properties to the _.where() function.

HTML




<html>
 
<head>
    <title>_.where() function</title>
    <script type="text/javascript" src=
    </script>
    <script type="text/javascript" src=
    </script>
</head>
 
<body>
    <script type="text/javascript">
        let goal = [
            {
                "category": "education",
                "title": "harry University",
                "value": 50000,
                "id": "1"
            },
            {
                "category": "travelling",
                "title": "tommy University",
                "value": 50000,
                "id": "2"
            },
            {
                "category": "education",
                "title": "jerry University",
                "value": 50000,
                "id": "3"
            },
            {
                "category": "business",
                "title": "Charlie University",
                "value": 50000,
                "id": "4"
            }
        ]
        console.log(_.where(goal, { category: "education" }));
    </script>
</body>
 
</html>


Output: 

Passing an array having numbers as one of it’s property to _.where() function:

Declare the array (here array is ‘users’) then choose one condition on which need to check like ‘id’ which has numbers in its details and finally console.log the final answer. The final output will contain all the elements that match.

Example: In this example, we are passing an array having numbers as one of it’s property to the _.where() function.

HTML




<html>
 
<head>
    <title>_.where() function</title>
    <script type="text/javascript" src=
    </script>
    <script type="text/javascript" src=
    </script>
</head>
 
<body>
    <script type="text/javascript">
        let users = [{ id: 1, name: "harry" },
        { id: 2, name: "jerry" },
        { id: 2, name: "jack" }];
        console.log(_.where(users, { id: 2 }));
    </script>
</body>
 
</html>


Output: 

_.where() function as _.findWhere() function:

The _.where() function can also work as _.findWhere() function under some conditions. Like if there is only one such element in the array that matches the given condition. As here the output will be an array containing only one element.

Example: In this example, we are implementing _.where() function as _.findWhere() function.

HTML




<html>
 
<head>
    <title>_.where() function</title>
    <script type="text/javascript" src=
    </script>
    <script type="text/javascript" src=
    </script>
</head>
 
<body>
    <script type="text/javascript">
        let studentArray = [
            { name: "Sam", score: 34 },
            { name: "Johny", score: 31 },
            { name: "Smithy", score: 23 },
            { name: "Rahul", score: 39 },
        ];
        console.log("student with score 23: ",
        _.where(studentArray, { 'score': 23 }));
    </script>
</body>
 
</html>


Output: 

 



Last Updated : 10 Jan, 2024
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads