Navigate back to the homepage

how to get length of object in react js?

Infinitbility
React
July 2nd, 2022 · 1 min read
how to get length of object in react js?

Hi Friends 👋,

Welcome To Infinitbility! ❤️

To get length of object in react js, convert the object to array using the Object.keys() method and use the array length property it will return of your number of object.

The length property of an object which is an instance of type Array sets or returns the number of elements in that array. The value is an unsigned, 32-bit integer that is always numerically greater than the highest index in the array.

In the following example, we will take the sample object, convert it into array of object keys and use array length to get the length of your object.

1let obj = {id: 1, name: "infinitbility"};
2
3console.log(Object.keys(obj).length) // 2

Today, I’m going to show you How do i find the length of the object in react js, as above mentioned here, I’m going to use the Object.keys() method, and the array length property to get length of json object.

Let’s start today’s tutorial how do you get the length of the object in react js?

In this example, we will do

  1. take an example of a object state
  2. use the Object.keys() method, and array length property
  3. print the length of the object on the page screen
1import React, { useState, useEffect } from "react";
2import "./styles.css";
3export default function App() {
4 const [sampleObject, setSampleObject] = useState({id: 1, name: "infinitbility"});
5
6 return (
7 <div className="App">
8 <h1>{`sampleObject length is ${Object.keys(sampleObject).length}`}</h1>
9 </div>
10 );
11}

In the above react js example, we have taken the sample object state, used Object.keys() and array length, and printed it on the screen.

I hope it helps you, All the best 👍.

Follow me on Twitter

Join our email list and get notified about new content

No worries, I respect your privacy and I will never abuse your email.

Every week, on Tuesday, you will receive a list of free tutorials I made during the week (I write one every day) and news on other training products I create.

Looking For React Native Tutorial?

we are trying to create the best Tutorial for react native developers.

When you want a daily updates about React Native Tutorial or infinitbility update subscribe to our newsletter.

Read React Native Tutorial

Request New Tutorial or Article on mail [email protected]

Guide book

Guidebook: The Javascript Monorepo Photoshop Guide

Tutorials

Categories

More articles from Infinitbility

how to find length of number in react js?

how to find length of number in react js?

An example of get length of number in react js with a step-by-step example.

July 1st, 2022 · 1 min read
how to find length of string in react js?

how to find length of string in react js?

An example of get length of string in react js with a step-by-step example.

July 1st, 2022 · 1 min read
© 2020–2022 Infinitbility
About
Link to $https://medium.com/infinitbilityLink to $https://www.facebook.com/InfinitbilityLink to $https://github.com/infinitbilityLink to $https://twitter.com/infinitbilityLink to $https://www.buymeacoffee.com/infinitbilityLink to $mailto:[email protected]