Why am I getting this type error: instance vs prototype

Question

Hi I am trying to learn the difference, or what is happening between .prototype and just a regular instance. Can anyone explain it, and why isnt this code working? I get a type error: "undefined is not a function". I am just trying to see what happens between the Ninja() class and .prototype, and the first instance. Then I'm trying to see what happens when I make a new Ninja() class called ninja. And repeat

     function Ninja() {
     this.swingSword = function() {
     return true;
     };
     }

     Ninja.prototype.swingSword = function() {
     return false;
     };

    var ninja = new Ninja;
    console.log(Ninja.prototype.swingSword());
    console.log(Ninja.swingSword());
    console.log(ninja.swingSword());
    console.log(ninja.prototype.swingSword());

thefourtheye · Answer 1 · 2014-04-12T06:21:13.387

prototype is a property of Function object and as all the function objects inherit from Function, they all have that property. In your case, Ninja is a function, but ninja is just an object constructed by Ninja, so it doesn't have prototype. Since, it doesn't have prototype, JavaScript returns with undefined. And you are trying to call swingSword on undefined, which is not possible. That is why you are getting that error.

You can check that like this

console.log({}.toString.call(Ninja));
# [object Function]
console.log({}.toString.call(ninja));
# [object Object]
console.log(Ninja.prototype);
# { swingSword: [Function] }
console.log(ninja.prototype);
# undefined

Also, note that, you have defined swingSword only on Ninja.prototype not on Ninja. When you invoke Ninja.swingSowrd(), JavaScript will look for it in Ninja first and then in its parent's prototype which would be Function.prototype. Lookups on Ninja will not involve Ninja.prototype. That is you are getting an error on that line as well.

Okay. then why did Ninja.swingSword() not work in the console? — , Apr 12 '14 at 06:21

score 0 · Answer 2 · answered Apr 12 '14 at 06:22

You can't call Ninja.swingSword(); because the function is not defined before the Ninja() constructor/function is called. But you could do new Ninja.swingSword(); returning true.

That said, ninja.prototype is undefined because it's an instance of the Ninja class, and all prototype variables are assigned directly to ninja. But, upon construction, you're setting this.swingSword to a new function that returns true. That's why ninja.swingSword(); will return true, instead of false as you might expect through the prototype function.

score 0 · Answer 3 · edited May 23 '17 at 10:25

The function Ninja does not have a swingSword method, the Ninja.prototype does. A function is an object same as many other objects with the difference that you can create instances with it using the new keyword and that it has a build in prototype member.

If I have an object called ben like this:

var ben = {
  name:"Ben",
  address:{
    street:"street name",
    city:"city name"
  }
}

It should be quite obvious here that I don't have ben.street but do have a ben.address.street.

An explanation about constructor functions and prototype can be found here.

Why am I getting this type error: instance vs prototype

3 Answers3