Object length in JavaScript: why is there no simple .length and what to do?
\n\nHave you ever caught yourself thinking: "Why does an array have a .length property, but an object doesn't?" If so — you are not alone. The question "Length of a JavaScript object" is among the top most popular on Stack Overflow with thousands of views. And it's no surprise: every beginner sooner or later tries to write obj.length and gets undefined.
In this article, we will figure out why this happens, and, most importantly, how to correctly calculate the length of an object in JavaScript. You will learn 4 working methods, understand when to use which, and forever forget about the confusion with object length.
\n\nWhy don't objects have a length property?
\n\nIt's all about the nature of objects. An array is an ordered collection with numeric indices. The JavaScript engine can easily say: "There are 5 elements in the array." But an object is an unordered set of key-value pairs. Theoretically, you can add a property, delete it, add it again — and the order is not guaranteed (at least in older specifications).
\n\nThat is why simple objects do not have a built-in .length. But that doesn't mean we can't calculate it. Let's see how.
Method #1: Object.keys() — the gold standard
\n\nThe most popular and recommended way is to use Object.keys(). This method returns an array of an object's own (not inherited) enumerable properties. And an array, as we know, has .length.
const user = {\n name: 'Anna',\n age: 28,\n city: 'Moscow',\n isAdmin: false\n};\n\nconst length = Object.keys(user).length;\nconsole.log(length); // 4\n\nIt's brilliantly simple! You get an array of keys, and then take its length. This method works in all modern browsers and Node.js.
\n\nWhat is included in Object.keys()?
\n\nAn important point: Object.keys() returns only own and enumerable properties. This means that:
- \n
- Own — not inherited through the prototype. If you created an object via a class or added a method to the prototype, it will not be included in the result. \n
- Enumerable — those whose
enumerableflag is set totrue. By default, all properties created via assignment are enumerable. But if you usedObject.defineProperty()withenumerable: false, such a property will be ignored. \n
Example with a non-enumerable property:
\n\nconst car = {\n brand: 'Toyota',\n model: 'Camry'\n};\n\nObject.defineProperty(car, 'vin', {\n value: 'JT2BF22KX00000001',\n enumerable: false\n});\n\nconsole.log(Object.keys(car).length); // 2 (vin is not counted)\n\nMethod #2: Object.values() and Object.entries()
\n\nSometimes you need not just the number of keys, but the number of values or pairs. Here, two twin brothers will help you:
\n\n- \n
Object.values(obj)— returns an array of values \n Object.entries(obj)— returns an array of arrays [key, value] \n
Both return arrays, which means they have .length:
const book = {\n title: 'The Master and Margarita',\n author: 'Bulgakov',\n year: 1966\n};\n\nconsole.log(Object.values(book).length); // 3\nconsole.log(Object.entries(book).length); // 3\n\nEssentially, this is the same count, but Object.entries() gives more data if you later need both keys and values.
Method #3: The for...in loop (and how to avoid the trap)
\n\nA classic but less convenient way is to use a for...in loop and manually count the properties:
const person = {\n name: 'Ivan',\n age: 30\n};\n\nlet count = 0;\nfor (let key in