JavaScript: Is a member defined?

Question

It seems to me that there are four different ways I can determine whether a given object (e.g. foo) has a given property (e.g. bar) defined:

1. if (foo.hasOwnProperty(bar)) {
2. if ('bar' in foo) {
3. if (typeof foo.bar !== 'undefined') {
4. if (foo.bar === undefined) {

To determine if there is a property named "bar" in the object foo, are all three of those statements equivalent? Are there any sublte semantics I don't know that makes any of these three statements different?

Answer 1

No they are totally different. Example:

foo = {bar: undefined};
Object.prototype.baz = undefined;
Object.prototype.bing = "hello";

Then:

(typeof foo.bar != "undefined")  === false
('bar' in foo)                   === true
(foo.hasOwnProperty('bar'))      === true


(typeof foo.baz != "undefined")  === false
('baz' in foo)                   === true
(foo.hasOwnProperty('baz'))      === false


(typeof foo.bing != "undefined") === true
('bing' in foo)                  === true
(foo.hasOwnProperty('bing'))     === false

Logic-wise:

• foo.hasOwnProperty('bar') implies 'bar' in foo
• typeof foo.bar != "undefined" implies 'bar' in foo
• But those are the only inferences you can draw; no other implications are universally true, as the above counterexamples show.

Answer 2

These are all different:

1. foo.hasOwnProperty('bar') tells you whether foo has the property and does not perform lookup along the prototype chain.

2. 'bar' in foo checks the prototype chain and returns true when it finds property bar in any object along the chain.

3. typeof foo.bar != 'undefined' returns true if foo or any object along its prototype chain has property bar and it's value is not undefined.

Here is an example that demonstrates these differences:

var foo1 = { 'bar1': 10, 'bar2': undefined };
function ctor() {}
ctor.prototype = foo1;
var foo2 = new ctor();
foo2.bar3 = 20;

console.log(foo2.hasOwnProperty('bar1')); // false
console.log(foo2.hasOwnProperty('bar2')); // false
console.log(foo2.hasOwnProperty('bar3')); // true
console.log(foo2.hasOwnProperty('bar4')); // false

console.log('bar1' in foo2); // true
console.log('bar2' in foo2); // true
console.log('bar3' in foo2); // true
console.log('bar4' in foo2); // false

console.log(typeof foo2.bar1 != 'undefined'); // true
console.log(typeof foo2.bar2 != 'undefined'); // false
console.log(typeof foo2.bar3 != 'undefined'); // true
console.log(typeof foo2.bar4 != 'undefined'); // false