Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

The standard prototypal inheritance in JavaScript is as follows:

function Animal() {
    this.legs = 0;
}
Animal.prototype.move = function () {
    alert("I'm moving!");
}

Bird.prototype = new Animal();
Bird.prototype.constructor = Bird;
function Bird() {
    this.legs = 2;
    this.wings = 2;
}
Bird.prototype.move = function () {
    alert("I'm flying!");
}

Does the function definition for Bird have to come after the assignment of Bird's prototype and constructor. I ask this because I'm trying to do this from within a namespace, and variable hoisting is causing my code to fail. As an example:

var namespace = {};
namespace.Animal = function () {
    this.legs = 0;
};
namespace.Animal.prototype.move = function () {
    alert("I'm moving!");
};

namespace.Bird.prototype = new namespace.Animal();
namespace.Bird.prototype.constructor = namespace.Bird;
namespace.Bird = function () {
    this.legs = 2;
    this.wings = 2;
};
namespace.Bird.prototype.move = function () {
    alert("I'm flying!");
};

Thanks to hoisting the namespace.Bird.prototype assignment statement and the namespace.Bird.prototype.constructor assignment statement fail. If I move the namespace.Bird function assignment above those two lines as shown in the following code block, however, the code seems to work.

namespace.Bird = function () {
    this.legs = 2;
    this.wings = 2;
};
namespace.Bird.prototype = new namespace.Animal();
namespace.Bird.prototype.constructor = namespace.Bird;

However, I don't know if there's a specific reason why most resources show the original order rather than having the function assignment come first.

Can someone please clarify?

Thanks!

share|improve this question

1 Answer 1

up vote 1 down vote accepted

The reason has to do with parse-time availability of functions and runtime availability of functions.

For example:

var afunc = asdf;
function asdf(){} 

is the same as

function asdf(){} 
var afunc = asdf;

But,

var afunc = asdf;
var asdf = function(){};

is not the same as

var asdf = function(){};
var afunc = asdf;

Does that make sense why?

Also, the answers to this question would probably help you

Javascript: var functionName = function() {} vs function functionName() {}

share|improve this answer
    
Thanks for the response! Yes, that makes sense to me. That's what I was referring to with regards to hoisting. What I was wondering was whether I could switch up the order of the inheritance statements such that the function-to-variable assignment comes first (as shown in my last block of code above) so that it works within the context of a namespace. Thanks again for the response! –  natlee75 Aug 7 '11 at 13:17
    
Your code is failing on namespace.Bird.prototype = new namespace.Animal(); because namespace.Bird is not defined yet. You could at least add namespace.Bird={}; beforehand and that works, but not sure what it buys you. It would make more sense to see the context you are working with. –  mrk Aug 8 '11 at 15:15

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.