Javascript prototype not inheriting functions... or prototype?

Question

Unsure of what the issue is. I'm pretty sure that I understand how prototypical inheritance is supposed to work. Essentially I'm wanting to make a javascript object can inherit property/function references from its prototype, the benefit of which is to be able to call a function from a child object without rewriting that function into the object itself.

My objects are:

function Animation(animationArguments) {
    Object.defineProperty(this, 'successfullyDuplicatedFunction', {
        value: function(){},
        enumerable : false
    });
}
Animation.prototype.gather = function() {}

repeatable.prototype = new Animation();
function repeatable(repeatableArguments) {
    Animation.call(this, repeatableArguments);
}

var createdObject = new repeatable(argumentsToPass);
    createdObject.gather(); //throws Uncaught TypeError: Object #<repeatable> has no method 'gather' 
    createdObject.successfullyDuplicatedFunction(); //successfully calls

Now, this is where I'm confused. In theory, I should be able to call repeatable.gather() to reference the animation's function gather. However, the console keeps telling me that it has no method gather. Oddly as well (and I'm not positive of the level of oddity), javascript is telling me that the object I'm creating (repeatable) has a proto:repeatable that's constructor is 'function repeatable' and with proto: Object. What happened to the Animation object? Also, further oddity is that it successfully duplicates the 'successfullyDuplicatedFunction' and lists it as a non-enumerable property that I can call/reference.

I'm in google chrome here for my main development if that helps.

Can anyone explain this a bit more clearly? I've looked through MANY different explanations of javascript prototypes and have gone through many different iterations of this code to try to get it to work how I assume prototypes are supposed to work. So it's probably my understanding to blame here... enlighten me?

There's no error ...has no method 'gather' given your code. There is an error argumentsToPass is not defined, but once that is fixed there's no error. jsfiddle.net/FH6Nz — cookie monster
– cookie monster, Commented Mar 29, 2014 at 2:07
Okay, so aparently more code is needed to give a thorough answer because I definitely have that problem with my working code. I just picked out the parts I thought were important to post here. At least I know I understand prototypes correctly(in theory). If it really is correct, maybe I should repost with more of my code? — Stephen Standridge
– Stephen Standridge, Commented Mar 29, 2014 at 2:13
You should put together a minimal yet complete example that fully represents the issue you're experiencing, and then update your question. — cookie monster
– cookie monster, Commented Mar 29, 2014 at 2:15
This is that... exactly. The only thing I left out is my animation creator that just parses through an array and routes the object creation to the object creation function required. (basically choosing between which animation subtype to create). — Stephen Standridge
– Stephen Standridge, Commented Mar 29, 2014 at 2:19
So post it. Whatever you're leaving out must be part of the problem. Again, there's no issue in the code you posted, beyond the undeclared variable. — cookie monster
– cookie monster, Commented Mar 29, 2014 at 2:26

Stephen Standridge · Accepted Answer · 2014-04-01 20:09:12Z

So, turns out that the problem is not with my understanding of prototypes, but in javascript's implementation of constructors in relation to their prototypal inheritance. I was attempting- without realizing it- to create a constructor that defined multiple inheritance through my function that routes the object creation to the object creation function required. Ideally, it would pass through multiple prototypes to construct an object that inherited from multiple prototypes. Prototypal inheritance supports this, but the pseudo-constructor pattern of javascript doesn't. To work around this, I created a constructor to parse these arguments and route the object parts to the unique prototype constructors.

What I was aiming at was prototype property delegation without knowing how to properly create a dynamic, object that inherited multiple prototypes while keeping the prototype chain in tact. What I was getting was a frankensteined object thats prototype was the constructor function itself. And because its prototype was not the prototype it needed to have, attempting to inherit functions by delegation someobject.prototype.fire = function(){}; wasn't working because the object, although it inherited the concatenated properties function someobject(Arguments) { this.property = arguments;} , it was not 'technically' an object of that prototype. Unfortunately, it seems that most every learning resource for javascript ties the constructor/prototype patterns by the hip and never even bother explaining why constructors aren't truly conducive to prototypal inheritance. Except for this great article.

I was getting the prototype chain I was because it was inheriting its prototype from the constructor itself, which was a simple function and thus a simple object. Although javascript does support property delegation and multiple inheritance, the constructor pattern does not.

Collectives™ on Stack Overflow

Javascript prototype not inheriting functions... or prototype?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related