改善javascript原型继承 [英] improve javascript prototypal inheritance

问题描述

我正在使用经典的JavaScript原型继承，例如:

I'm using a classical javascript prototypal inheritance, like this:

function Foo() {}   
Naknek.prototype = {
//Do something
};
var Foo = window.Foo = new Foo();

我想知道如何改善这一点以及为什么不能使用此模型:

I want to know how I can improve this and why I can't use this model:

var Foo = window.Foo = new function() {
};
Foo.prototype = {
//Do something
};

为什么此代码不起作用?在我看来，这比经典的原型继承更具逻辑性.

Why this code doesn't work? In my head this is more logical than the classical prototypal inheritance.

推荐答案

您的var Foo = window.Foo = new Foo();示例很奇怪.首先声明一个函数Foo，然后为它的原型分配一些东西(我想在第二行中用Foo替换Nannak)，然后通过为其分配覆盖对该函数的引用.

Your var Foo = window.Foo = new Foo(); example is...odd. First you declare a function Foo, then you assign something to its prototype (I assume you meant to replace Nannak with Foo in your second line), and then you overwrite the reference to the function by assigning to it.

标准Javascript原型继承如下:

Standard Javascript prototypical inheritance looks like this:

// Create a constructor `Foo`
function Foo() {
}

// Give the prototype for `Foo` objects a function bound to the
// property `bar`
Foo.prototype.bar = function() {
}

// Only do this bit if you're doing this within a function and you want
// to make `Foo` available as a property of `window` (e.g., effectively
// a global variable. If this code is already at global scope, there's
// no need to do this.
window.Foo = Foo;

这是您使用Foo的方式:

// Create a `Foo` and use its `bar`
var f = new Foo();
f.bar();

其他一些注意事项:

• 请勿使用new function() { ... }，除非您真的非常了解自己在做什么.它创建一个由该函数初始化的对象，而不创建一个新函数.除了某些高级边缘情况外，几乎不需要任何相似(但完全不同的 )new Function(...).
• 在我上面的示例中绑定到bar的函数是匿名的(绑定到的属性具有名称，但是该函数没有).我不喜欢匿名函数，但是我不想弄乱上面的示例. 此处更多.
• 如果您在全局范围内使用var(尚不清楚您是否使用过var)，它将在window对象上创建一个属性.如果您在函数中并且想要两者创建一个window 的并创建一个名为var Foo = window.Foo = ... >.
• 分配原型属性的Foo.prototype = { .. };方法有效，但这通常不是一个好主意(再次，除非您对此有足够的了解).当您执行此操作时，您将完全替换通过new调用函数时使用的原型对象，而如果仅向其中添加属性(Foo.prototype.bar = ...)，则只是在扩充原型，而不是替换它.替换原型是完全有效的，但是如果您不小心，可能会发生一些非显而易见的事情. :-)

• Never use new function() { ... } unless you really, really know what you're doing. It creates an object initialized by the function, it does not create a new function. There's almost never any need for the similar (but totally different) new Function(...), either, again except for some advanced edge cases.
• The function bound to bar in my example above is anonymous (the property it's bound to has a name, but the function does not). I'm not a fan of anonymous functions, but I didn't want to clutter the example above. More here.
• If you use var at global scope (it wasn't clear from your question whether you were), it creates a property on the window object. You'd only need to do var Foo = window.Foo = ... if you're within a function and want to both create a propety of window and create a local variable called Foo. (Which maybe you meant to do! :-) )
• The Foo.prototype = { .. }; way of assigning prototypical properties works, but it's not generally a good idea (again, unless you're pretty up-to-speed on this stuff). When you do that, you're completely replacing the prototype object used when you call the function via new, whereas if you just add properties to it (Foo.prototype.bar = ...), you're just augmenting the prototype, not replacing it. Replacing the prototype is perfectly valid, but there are some non-obvious things that can happen if you're unwary. :-)

这篇关于改善javascript原型继承的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！