Adding a prototype to an object literal

Question

I have some object, say son, which I\'d like to inherit from another object father.

Of course I can make a constructor function for father,

Answer 1

You're right, __proto__ is a non-standard property, and the only two standard ways you have to set a new object's [[Prototype]], are:

• Through the use of a constructor and the new operator (as you already mention).
• Using the ECMAScript 5 Object.create method.

Object.create is not widely supported yet (works on IE9Pre3+, Firefox 3.7Alpha+, Chrome 5+ Safari 5+, Rhino 1.7), but at some point all the implementations will conform the ES5 spec.

It can take two arguments, the first one is the object that will be used as the [[Prototype]] of the new object, and the second one, is another object where the own properties can be described (in the same structure that you would use Object.defineProperties).

For example:

var father = {
  firstProperty: 1,
  secondProperty: 2
};

var son = Object.create(father, {
  thirdProperty: {
    value: 'foo'
  }
});

father.isPrototypeOf(son); // true
son.firstProperty; // 1

The son internal [[Prototype]] property will refer to father, and it will contain a value property named thirdProperty.

Answer 2

Specifying the prototype for an object literal is a little "wonky", since you'll primarily want the prototype on objects that you create using the constructor syntax (e.g., new X()). Not saying this isn't possible... but it's strange. A similar pattern that is well proved out (used by jQuery, for example), is to instead define the prototype as an object literal. For example:

var X = function() {};
X.prototype = {
  protoFunc1: function() {},
  protoFunc2: function() {}
};

Answer 3

That's incorrect jmar777. If for example you have

var X = function() {};
X.prototype = {
  protoFunc1: function() { console.log('p1');},
  protoFunc2: function() { console.log('p2');}
};

X.protoFunc1(); // is not a function 

That means that what you're doing:

X.prototype = {}

is just creating an object called prototype. Not the actual prototype. To use prototype you have to use constructor functions.

if however you modify it to this (constructor method)

function X(){};
X.prototype.protoFunc1 = function() { 
    console.log('p1');
}
X.prototype.protoFunc2 = function() { 
    console.log('p2');
}

var x = new X();
x.protoFunc1(); //'p1'

It would work.

Either go the object literal method without using prototype or use the contructor method using prototype.