How to determine whether an object has a given property in JavaScript

javascript

javascript-objects

property-checking

javascript-best-practices

byAlex Kataev·Nov 16, 2024

To swiftly determine if an object has a specific property, use either the 'propertyName' in object to include inherited properties, or object.hasOwnProperty('propertyName') for just the object's own properties:

if ('age' in person) {
  // Yep, 'age' property exists, it's lurking somewhere (even in the dark corners aka inheritance)!
}

if (person.hasOwnProperty('age')) {
  // HR authorized, 'age' is a clear property, no murky inheritance here!
}

Lock 'n' Load with robust property checking

Being accurate in JavaScript is like art. Sometimes the star of the show isn't always on the stage:

Beware of the undefined creatures and null ghosts

Properties cloaked in undefined or null might exist, but they sure love to play hide-and-seek:

const universe = { matter: undefined };

'matter' in universe; // Yep, it's there, although it's just undefined (like most answers in quantum physics)!
universe.matter !== undefined; // Well, this is awkward... returns false

Own the property, or inherited real-estate?

hasOwnProperty won't peek into the blueprint (sticking to the direct architecture). However, 'in' doesn't care about lineage and scours the entire estate:

function Ancestry() {
  this.inherited = true;
}
Ancestry.prototype.familySilver = 'classy';

const descendant = new Ancestry();

descendant.hasOwnProperty('inherited'); // Absolutely! 'inherited' property signed for delivery. Inherited: true
'familySilver' in descendant; // Nice find! Just dusted off a piece of the 'familySilver'. Inherited, but still shines!

Existential Crisis: Is Undefined or Null?

Before asking for a map, ensure there isn't an abyss (undefined or null) in front of you. Trust me, runtime errors are no fun:

if (typeof treasureMap !== 'undefined' && 'X' in treasureMap) {
  // Is there treasure? The map exists and 'X' marks the spot!
}

Dive deep with these treasure maps

Maps don't always work, especially when Captain JavaScript throws in diabolical puzzles for fun:

Modern Sea charts: Utility libraries

Trust me, Underscore.js or Lodash are no vintage maps. Methods like _.has(object, 'property') navigate the sea of objects with a plunderer’s precision.

Fear not! Modern JavaScript hasn’t forgotten you. Try Reflect.has(object, propertyKey). It’s similar to the in operator but works with the powerful Reflect API.

"Ye Been Warned!" - Mysterious Corners of JavaScript

If you are one to defy the mighty JavaScript, here are few untold secrets:

Property Visibility Magic Show

Magic isn't real, but property enumerability can vanish a property in JavaScript:

const magicBook = Object.create({}, {
  hiddenSpell: {
    value: true,
    enumerable: false
  }
});

'hiddenSpell' in magicBook; // Oh my! returns true
magicBook.propertyIsEnumerable('hiddenSpell'); // As I guessed! returns false (the hidden spell doesn't enjoy limelight)

Beware of the Deceivers

Global object properties like toString can be spooky:

({}).hasOwnProperty('toString'); // returns false, yeah, strange, but true!

Alien Objects

Alien objects don't follow usual javascript prototype hierarchy. They can make hasOwnProperty go haywire:

const alienObject = Object.create(null);
alienObject.key = true;

typeof alienObject.hasOwnProperty; // undefiend, since 'ET' doesn't follow our rules!
'key' in alienObject; // trusty old 'in' saves the day again and returns true