How to check if object has any properties in JavaScript?
Assuming I declare
var ad = {};
How can I check whether this object will contain any user-defined properties?
You can use the built in Object.keys
method to get a list of keys on an object and test its length.
var x = {};
// some code where value of x changes and than you want to check whether it is null or some object with values
if(Object.keys(x).length){
// Your code here if x has some properties
}
What about making a simple function?
function isEmptyObject(obj) {
for(var prop in obj) {
if (Object.prototype.hasOwnProperty.call(obj, prop)) {
return false;
}
}
return true;
}
isEmptyObject({}); // true
isEmptyObject({foo:'bar'}); // false
The hasOwnProperty
method call directly on the Object.prototype
is only to add little more safety, imagine the following using a normal obj.hasOwnProperty(...)
call:
isEmptyObject({hasOwnProperty:'boom'}); // false
Note: (for the future) The above method relies on the for...in
statement, and this statement iterates only over enumerable properties, in the currently most widely implemented ECMAScript Standard (3rd edition) the programmer doesn't have any way to create non-enumerable properties.
However this has changed now with ECMAScript 5th Edition, and we are able to create non-enumerable, non-writable or non-deletable properties, so the above method can fail, e.g.:
var obj = {};
Object.defineProperty(obj, 'test', { value: 'testVal',
enumerable: false,
writable: true,
configurable: true
});
isEmptyObject(obj); // true, wrong!!
obj.hasOwnProperty('test'); // true, the property exist!!
An ECMAScript 5 solution to this problem would be:
function isEmptyObject(obj) {
return Object.getOwnPropertyNames(obj).length === 0;
}
The Object.getOwnPropertyNames
method returns an Array
containing the names of all the own properties of an object, enumerable or not, this method is being implemented now by browser vendors, it's already on the Chrome 5 Beta and the latest WebKit Nightly Builds.
Object.defineProperty
is also available on those browsers and latest Firefox 3.7 Alpha releases.
You can loop over the properties of your object as follows:
for(var prop in ad) {
if (ad.hasOwnProperty(prop)) {
// handle prop as required
}
}
It is important to use the hasOwnProperty()
method, to determine whether the object has the specified property as a direct property, and not inherited from the object's prototype chain.
Edit
From the comments: You can put that code in a function, and make it return false as soon as it reaches the part where there is the comment
With jQuery you can use:
$.isEmptyObject(obj); // Returns: Boolean
As of jQuery 1.4 this method checks both properties on the object itself and properties inherited from prototypes (in that it doesn't use hasOwnProperty).
With ECMAScript 5th Edition in modern browsers (IE9+, FF4+, Chrome5+, Opera12+, Safari5+) you can use the built in Object.keys method:
var obj = { blah: 1 };
var isEmpty = !Object.keys(obj).length;
Or plain old JavaScript:
var isEmpty = function(obj) {
for(var p in obj){
return false;
}
return true;
};