Adding a prototype to an object literal
I have some object, say son
, which I'd like to inherit from another object father
.
Of course 开发者_JAVA技巧I can make a constructor function for father, like
Father = function() {
this.firstProperty = someValue;
this.secondProperty = someOtherValue;
}
And then use
var son = new Father();
son.thirdProperty = yetAnotherValue;
but this is not exactly what I want. Since son
is going to have many properties, it would be more readable to have son declared as an object literal. But then I don't know how to set its protoype.
Doing something like
var father = {
firstProperty: someValue;
secondProperty: someOtherValue;
};
var son = {
thirdProperty: yetAnotherValue
};
son.constructor.prototype = father;
will not work, as the prototype chain seems to be hidden and not care about the change of constructor.prototype.
I think I can use the __proto__
property in Firefox, like
var father = {
firstProperty: someValue;
secondProperty: someOtherValue;
};
var son = {
thirdProperty: yetAnotherValue
__proto__: father
};
son.constructor.prototype = father;
but, as far as I understand, this is not a standard feature of the language and it is better not to use it directly.
Is there a way to specify the prototype for an object literal?
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
.
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.
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() {}
};
精彩评论