Why this JS code is not valid?

Question

Below code snipped throws an error TypeError: myObj.prototype is undefined. Could someone explain me why?

Why there is no prototype for new Object() & object literals as specified below?

var myObj = {
    a : "This is a",
    b : "This is b"
}

myObj.prototype.c= "This is c";  // TypeError: myObj.prototype is undefined

If this is not valid approach then how can I achieve this?

You can get the prototype from an instance with Object.getPrototypeOf : https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/getPrototypeOf although in this case you probably wouldn't want to. — James Gaunt, May 24 '13 at 12:19
Have a look at [Eloquent Javascript](http://eloquentjavascript.net/chapter8.html). — Alberto De Caro, May 24 '13 at 12:34

Jon · Accepted Answer · 2013-05-24T12:38:10.877

10

In earlier versions of EcmaScript you could not directly access the prototype of objects; the prototype property existed only on functions, and it comes into play when they are used as constructors. So you could do this:

// This is the myObj constuctor
function myObj() {
    this.a = "This is a";
    this.b = "This is b";
}

// Setting a property on the constructor prototype
// All instances will share this
myObj.prototype.c= "This is c";

// Creating a new object and testing its "c" property
var obj = new myObj();
alert(obj.c); // "This is c"

Modern browsers implement Object.getPrototypeOf, which means you can do this:

var myObj = {
    a : "This is a",
    b : "This is b"
}

Object.getPrototypeOf(myObj).c= "This is c";

However, you have to be careful! If you do this, then all objects that exist now and all objects that get created in the future will inherit the property c through their prototype chain!

This is because myObj is of type Object, and the prototype of Object is inherited by everything that is an object of any type. This leads to:

var myObj = {
    a : "This is a",
    b : "This is b"
}

Object.getPrototypeOf(myObj).c= "This is c";

var anotherObject = {};

alert(anotherObject.c); // "This is c" -- was it expected?

See it in action.

edited May 24 '13 at 12:38

answered May 24 '13 at 12:18

Jon

428,835
81
738
806

No! "x.prototype" is NOT "the prototype of x". – georg May 24 '13 at 12:20
@thg435: I 'm not sure I understand your point, can you please clarify? – Jon May 24 '13 at 12:21
Sure -- when you write "someObj.prototype" in javascript you do not access the prototype of the object. `x.prototype` is completely different from the actual prototype of x - it just happens to have a confusing name. – georg May 24 '13 at 12:25
@thg435: That assumes `someObj.prototype` exists for the "object". But `someObj.prototype` does not exist in general, only in the special case where `someObj` is a function. So where does that leave us? – Jon May 24 '13 at 12:26
I think this post explains the matter better: http://stackoverflow.com/a/16666302/989121 (the 2nd part) – georg May 24 '13 at 13:04
@thg435: OK, I think I understand: you object to the passage *"...not directly access the prototype of objects; the `prototype` property existed...*" which seems to imply that the prototype of objects is what you access with `someFunction.prototype`. If this is it then I understand the objection, but I 'm not sure how to improve the wording. – Jon May 24 '13 at 13:14

score 1 · Answer 2 · answered May 24 '13 at 12:19

you should first declare a custom object like this:

function myObj(){
    this.a = "a";
    this.b = "b";
}

then you can add the "c" property to that object as follows

myObj.prototype.c = "c";

as you can see here http://jsfiddle.net/gwaqm/ the property c is successfully setted.

score 0 · Answer 3 · answered May 24 '13 at 12:22

0

If you wanted to add the c property after object creation you can do

myObj.c = 'This is c';

answered May 24 '13 at 12:22

Frison Alexander

3,228
2
29
32

Zotta · Answer 4 · 2013-05-24T12:46:17.253

Objects inherit the properties of the prototype of their constructor, not their own prototype.

You can use myObj.constructor.prototype. But you should not do that because ({ }).constructor == Object. So it you modify the prototype of that object you modify the prototype of all objects.

To create an object with a specific prototype use:

//New method
var proto = ...
var myObj = Object.create(proto);

OR

//Old method
var proto = ...
var constructor = function(){};
constructor.prototype = proto;
var myObj = new constructor();

You should not use __proto__, because it is bad design and "Non-standard" (See https://developer.mozilla.org/de/docs/JavaScript/Reference/Global_Objects/Object) You can use Object.getPrototypeOf(obj) though

Christoph · Answer 5 · 2013-05-24T12:34:32.910

0

You cannot access the prototype of an Object via prototype - it would just be a property called prototype. You could access the prototype via __proto__ (no ECMA-Standard!)

var myObj = {
    a : "This is a",
    b : "This is b"
}

myObj.__proto__.c= 3;

var test = {};

test.c //-> yields 3

The correct (standard compliant) way however would be to use either:

Object.getPrototypeOf(myObj)

or

myObj.constructor.prototype

edited May 24 '13 at 12:34

answered May 24 '13 at 12:28

Christoph

50,121
21
99
128

@Siva what's confusing about it? – Christoph May 24 '13 at 12:34

score 0 · Answer 6 · answered May 24 '13 at 12:40

In your first example you used Object Literal Notation to define an object with two properties: a and b.

prototype is related to the constructor object. If you want to access the prototype of an object, you first start with a constructor function:

function myClass(){
  this.a = "This is a";
}

Then you refer to its prototype:

myClass.prototype.pa = "This is prototyped a";

Hence, all the objects that eventually share the myClass prototype will inherit the pa member.

Why this JS code is not valid?

6 Answers6