How to print object by id in an array of objects in JavaScript ?

In this article, we will learn how to print object by id in an array of objects in JavaScript. We have an array of objects and in every object, there is a key named id, whose value is a number. We have to return the object which matches the specified condition.

These are many approaches to print object by id in an array of objects in JavaScript:

• Using Array.filter() Method
• Using Array.find() Method
• Using Loops in JavaScript
• Using Underscore.js _.find() Function

Method 1: Using Array.filter() Method

This method is used for creating a new array from an existing array after applying some conditions.

Example:

Javascript

// This is our array of Objects
let data = [
    { id: 1, name: "a" },
    { id: 2, name: "b" },
    { id: 3, name: "c" },
    { id: 4, name: "d" },
    { id: 5, name: "e" },
    { id: 6, name: "f" },
];

let idYouWant = 1;
let propertyYouWant = "name";

// Using Array.filter( ) method
// we are iterating through each
// items in the array and checking
// which item's id value is equal
// to the id we want

let res = data.filter((item) => {
    return item.id == idYouWant;
});

// After using filter method we got
// an array of object. Now take its
// first element and use its
// 'propertyYouWant' key
let exactRes = res[0][propertyYouWant];

// Printing the property we want
console.log(exactRes);

Output

a

Method 2: Using Array.find() Method

First, we are searching in which object the given id exists, then we extract the name property from that object.

Example:

Javascript

// This is our array of Objects
let data = [
    { id: 1, name: "a" },
    { id: 2, name: "b" },
    { id: 3, name: "c" },
    { id: 4, name: "d" },
    { id: 5, name: "e" },
    { id: 6, name: "f" },
];

let idYouWant = 2;
let propertyYouWant = "name";

// Using Array.find( ) we are searching
// in which object our searching id present

let res = data.find((item) => {
    return item.id == idYouWant;
});

// Now print the property which you want
// from the object res
// console.log(res[propertyYouWant])
console.log(res[propertyYouWant]);

Output

b

Method 3: Using for loop

Using for loop first we are iterating the array and searching in which object the given id is present and after that, we are printing the property we wanted.

Example:

Javascript

// This is our array of objects
let data = [
    { id: 1, name: "a" },
    { id: 2, name: "b" },
    { id: 3, name: "c" },
    { id: 4, name: "d" },
    { id: 5, name: "e" },
    { id: 6, name: "f" },
];

let idYouWant = 2;
let propertyYouWant = "name";

// Iterating over the array using for
// loop and searching in which object
// the id present
// After getting the object we print the
// property we wanted from the object

for (let i = 0; i < data.length; i++) {
    if (data[i].id == idYouWant) {
        console.log(data[i][propertyYouWant]);
    }
}

Output

b

Method 4: Using Underscore.js _.find() Function

The _.find() function looks at each element of the list and returns the first occurrence of the element that satisfy the condition. If any element of the list is not satisfy the condition then it returns the undefined value.

Example:

Javascript

// This is our array of Objects
const _ = require('underscore');
let data = [
    { id: 1, name: "a" },
    { id: 2, name: "b" },
    { id: 3, name: "c" },
    { id: 4, name: "d" },
    { id: 5, name: "e" },
    { id: 6, name: "f" },
];

let idYouWant = 2;
let propertyYouWant = "name";

let obj = _.find(data, function (obj) {
          return obj.id == idYouWant })

// Now print the property which you want
// from the object res
console.log(obj[propertyYouWant]);

Output:

b