[英]Newly added function to the prototype of the constructor doesn't work when it's called on objects
function userCreator(name,score){
const newUser = Object.create(userFunctions);
newUser.name = name;
newUser.score = score;
return newUser;
}
userFunctions = {
increment: function(){
this.score++;
}
};
userCreator.prototype.foo = function(){
console.log("foo");
};
const user1 = userCreator("Phil",5);
user1.foo();
I try to add a function to my constructure but when I add this function and call it with user1
it says user1.foo()
is not a function. 我尝试将一个函数添加到我的结构中,但是当我添加此函数并用user1
调用它时,它说user1.foo()
不是函数。
It looks like you want the object prototype to inherit from the userFunctions
object, in which case you should set 看起来您想让对象原型从userFunctions
对象继承,在这种情况下,您应该设置
userCreator.prototype = Object.create(userFunctions);
outside of the constructor. 在构造函数之外 。 You should also call new
on the constructor, and don't return an object from it, in order for <functionName>.prototype
to work correctly: 您还应该在构造函数上调用new
,并且不要从中返回任何对象,以使<functionName>.prototype
正常工作:
function userCreator(name,score){ this.name = name; this.score = score; } userFunctions = { increment: function(){ this.score++; } }; userCreator.prototype = Object.create(userFunctions); userCreator.prototype.foo = function(){ console.log("foo"); }; const user1 = new userCreator("Phil",5); user1.foo();
(technically, you could use return this
, but it's superfluous) (从技术上讲,您可以使用return this
,但这是多余的)
The prototype you're assigning the object in userCreator
isn't userCreator.prototype
, it's userFunctions
. 您要在userCreator
分配对象的原型不是userCreator.prototype
,而是userFunctions
。 So you'd add foo
to that, not userCreator.prototype
. 因此,您需要在其中添加foo
,而不是userCreator.prototype
。 Also, don't forget to declare userFunctions
, at the moment your code is falling prey to what I call The Horror of Implicit Globals . 另外,别忘了声明userFunctions
,此刻您的代码已成为我所谓的“隐式全局恐怖”的牺牲品。
function userCreator(name,score){ const newUser = Object.create(userFunctions); newUser.name = name; newUser.score = score; return newUser; } const userFunctions = { // *** Added const increment: function(){ this.score++; } }; userFunctions.foo = function(){ // *** `userFunctions`, not `userCreator.prototype` console.log("foo"); }; const user1 = userCreator("Phil",5); user1.foo();
userCreator.prototype
would be used automatically as the prototype of the new object if you were using new userCreator
to create the object, but you're doing it manually with Object.create(userFunctions)
. 如果您使用new userCreator
创建对象,那么userCreator.prototype
将自动用作新对象的原型,但是您可以通过Object.create(userFunctions)
手动进行操作。
Or alternately, get rid of userFunctions
and use userCreator.prototype
throughout: 或者,也可以摆脱userFunctions
并在整个过程中使用userCreator.prototype
:
function userCreator(name,score){ const newUser = Object.create(userCreator.prototype); newUser.name = name; newUser.score = score; return newUser; } userCreator.prototype.increment = function(){ this.score++; }; userCreator.prototype.foo = function(){ console.log("foo"); }; const user1 = userCreator("Phil",5); user1.foo();
Just for what it's worth, the version using new
: 仅仅为了它的价值,使用new
的版本:
function UserCreator(name,score){ this.name = name; this.score = score; } UserCreator.prototype.increment = function(){ this.score++; }; UserCreator.prototype.foo = function(){ console.log("foo"); }; const user1 = new UserCreator("Phil",5); user1.foo();
or, since you're already using ES2015+ features: 或者,因为您已经在使用ES2015 +功能:
class UserCreator { constructor(name,score){ this.name = name; this.score = score; } increment() { this.score++; } } // If for some reason you wanted to add it separately // from the `class` definition UserCreator.prototype.foo = function(){ console.log("foo"); }; const user1 = new UserCreator("Phil",5); user1.foo();
But doing it without new
is fine, too, just add to the correct object. 但是,也可以不添加new
内容也可以,只需添加到正确的对象即可。
Since you do not use the new
syntax in calling userCreator
(and it isn't a function that returns an instance of its prototype), you don't use userCreator
as a (standard) constructor. 由于您在调用userCreator
未使用new
语法(并且它不是返回其原型实例的函数),因此请勿将userCreator
用作(标准)构造函数。 Therefore the created objects do not have userCreator.prototype
as proto, and so any mutation of userCreator.prototype
has no effect on your created object. 因此,创建的对象不具有userCreator.prototype
作为原型,因此userCreator.prototype
任何突变都不会影响您创建的对象。
You seem to want to have User objects with UserFunctions. 您似乎想要具有UserFunctions的User对象。 In ES6 syntax you would achieve that like this: 在ES6语法中,您可以这样实现:
class Scorer { constructor() { this.score = 0; } increment() { this.score++; } } class User extends Scorer { constructor(name, score) { super(); this.name = name; this.score = score; } foo() { console.log("foo"); } } const user1 = new User("Phil", 5); user1.foo();
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.