Nav Nav - 1 year ago 74
Javascript Question

difference between Object.create(Object.prototype) , Object.create(Object) and Object.create(null)

Which parameter should i pass for the first parent object from which others will inherit and which one is more efficient




returns an empty object

returns a function why????( I checked my log and it says function...i used console.dir() )

returns a non empty object

How does this whole thing work ... I m more used to the Classname .prototype thing :(

Can't understand what is going on here

Answer Source

Preface: JavaScript uses prototypical inheritance, which means that an object can have (usually does have) a prototype behind it, which is another object. If you try to get the value of a property from an object that it doesn't have, the JavaScript engine looks to the object's prototype (and its prototype, and so on) to find it.

Object.create creates objects. The first argument you give Object.create is the object to use as the prototype of the object it creates. So:

// Create an object with a property 'foo'
var a = {
    foo: 42

// Create a blank object using `a` as its prototype
var b = Object.create(a);

// Give `b` a property of its own = "hi";

That gives us this in memory:

                           +---------------+      +-------------------+
                           | [[Prototype]] |----->| (the standard     |
a----------------------+-->| foo: 42       |      | object prototype) |
                       |   +---------------+      +-------------------+   
    +---------------+  |
b-->| [[Prototype]] |--+
    | bar: "hi"     |

Proof b uses a:

console.log(; // 42 = 67;
console.log(; // 67

Addressing some of your variations:

var o = Object.create(Object.prototype);

That's pointless, just use var o = {};, it does the same thing (creates a new blank object whose prototype is Object.prototype).

var o = Object.create(Object);

Creates a new blank object o whose prototype is the Object function. It doesn't create a function, just a non-function object that has a function as its prototype. This would be quite odd and probably isn't what you want.

var o = Object.create(null);

Creates a new blank object o whose prototype is null. Since its prototype is null, it doesn't have the usual Object.prototype stuff, like toString and valueOf and hasOwnProperty. That's a bit unusual, although there are use cases for it, such as when you're using an object as a dictionary/map and don't want false positives for those property names. (In ES2015 [aka ES6] another option is to use Map instead.)

As thg435 points out in a comment below, one of the confusing things about JavaScript is that the prototype of an object is a completely different thing from the prototype property you see on functions. It would probably be better if the prototype property had had a different name (although I can't imagine what name it would be without being massively clunky).

An object (let's call it o) has a prototype object it inherits properties from. The object on the prototype property of functions is not necessarily the prototype of any object at all. Instead, it's the object that will be assigned as the prototype of any object created via new using that function.

Examples help here.

function Foo() {

That function, Foo, has a property Foo.prototype that refers to an object. That object is not, yet, used as the prototype of anything. It's just an object assigned to a property called prototype on the Foo object instance.

var f = new Foo();

Now that object is used as a prototype, specifically it's the prototype of the f object created by the new Foo call.

Ignoring a couple of details, this line of code:

var f = new Foo();

...basically does this:

// Create a blank object, giving it `Foo.prototype` as its prototype
var f = Object.create(Foo.prototype);

// Call` Foo` using that new object as `this`;

As I say, that leaves out a couple of details, but hopefully it helps make it clear what the prototype property of functions is for...

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download