Understanding the difference between Object.create() and new SomeFunction()
I recently stumbled upon the Object.create() method in JavaScript, and am trying to deduce how it is different from creating a new instance of an object with new SomeFunction() , and when you would want to use one over the other.
Consider the following example:
var test = {
val: 1,
func: function() {
return this.val;
}
};
var testA = Object.create(test);
testA.val = 2;
console.log(test.func()); // 1
console.log(testA.func()); // 2
console.log('other test');
var otherTest = function() {
this.val = 1;
this.func = function() {
return this.val;
};
};
var otherTestA = new otherTest();
var otherTestB = new otherTest();
otherTestB.val = 2;
console.log(otherTestA.val); // 1
console.log(otherTestB.val); // 2
console.log(otherTestA.func()); // 1
console.log(otherTestB.func()); // 2The object used in Object.create actually forms the prototype of the new object, where as in the new Function() form the declared properties/functions do not form the prototype.
Yes, Object.create builds an object that inherits directly from the one passed as its first argument.
With constructor functions, the newly created object inherits from the constructor's prototype, eg:
var o = new SomeConstructor();
In the above example, o inherits directly from SomeConstructor.prototype .
There's a difference here, with Object.create you can create an object that doesn't inherit from anything, Object.create(null); , on the other hand, if you set SomeConstructor.prototype = null; the newly created object will inherit from Object.prototype .
You cannot create closures with the Object.create syntax as you would with the functional syntax. This is logical given the lexical (vs block) type scope of JavaScript.
Well, you can create closures, eg using property descriptors argument:
var o = Object.create({inherited: 1}, {
foo: {
get: (function () { // a closure
var closured = 'foo';
return function () {
return closured+'bar';
};
})()
}
});
o.foo; // "foobar"
Note that I'm talking about the ECMAScript 5th Edition Object.create method, not the Crockford's shim.
The method is starting to be natively implemented on latest browsers, check this compatibility table.
Very simply said, new X is Object.create(X.prototype) with additionally running the constructor function. (And giving the constructor the chance to return the actual object that should be the result of the expression instead of this .)
That's it. :)
The rest of the answers are just confusing, because apparently nobody else reads the definition of new either. ;)
Here are the steps that happen internally for both calls:
(Hint: the only difference is in step 3)
new Test() :
new Object() obj obj.__proto__ to Test.prototype return Test.call(obj) || obj; // normally obj is returned but constructors in JS can return a value Object.create( Test.prototype )
new Object() obj obj.__proto__ to Test.prototype return obj; So basically Object.create doesn't execute the constructor.
上一篇: 在闭包中使用原型模式