How to create an object from a prototype in JavaScript?

Question

I am new to JavaScript and currently reading the book "JavaScript: The Good Parts". I am trying to understand the following:

function create(proto) {
    var F = function() { };
    F.prototype = proto;
    return new F();
}
function create2(proto) {
    var o = { };
    o.prototype = proto;
    return o;
}
var o = { }, c1 = create(o), c2 = create2(o);
o.status = 'OK';
document.writeln(c1.status);
document.writeln(c2.status);

create(proto) is how this is done in the book. create2(proto) is how I thought it should work. Obviously, the example from the book is working while mine is not, so the output is:

OK
undefined

Now my question is: Why does create2(proto) not work like create(proto)?

there is because var o = { }; is an object literal and not a function — invernomuto
– invernomuto, Commented Dec 14, 2014 at 10:39
possible duplicate of How does JavaScript .prototype work? - F is a function while o is not. — Bergi
– Bergi, Commented Dec 14, 2014 at 10:55

thefourtheye · Accepted Answer · 2014-12-14 10:39:25Z

4

In the create, you are creating a new object with the help of a constructor function (new F()). So, the prototype chain is established, between proto object and the object constructed with the constructor function.

In create2, you are creating an Object and creating a property on it with the name prototype. In this case, the prototype chain is not established.

That is why the object created by create2, couldn't go up the prototype chain to find status.

Note: In the second case, you can still do

document.writeln(c2.prototype.status);

answered Dec 14, 2014 at 10:39

thefourtheye

241k53 gold badges466 silver badges505 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Kiba · Accepted Answer · 2014-12-14 10:50:58Z

1

In create2 method if you need the standard prototype in not the standard "prototype". If you want this to work you need to use Object.setPrototypeOf(o, proto) The new created property "prototype" will be the satellite object that will have symbolic link to the parent object.

function create(proto) {
 var F = function() { };
 F.prototype = proto;
 return new F(); 
} 

function create2(proto) {
var o = { };
Object.setPrototypeOf(o, proto);
return o;
}
var o = { }, c1 = create(o), c2 = create2(o);
o.status = 'OK';
console.log(c1.status);
console.log(c2.status);

answered Dec 14, 2014 at 10:50

Kiba

11k7 gold badges30 silver badges31 bronze badges

1 Comment

Christian Schlichtherle Over a year ago

Thanks for the edit. FYI: This works fine in Chrome and Firefox, but not in Safari and also my IDE (IntelliJ IDEA Ultimate) doesn't recognize Object.setPrototypeOf(o, proto).

Collectives™ on Stack Overflow

How to create an object from a prototype in JavaScript?

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related