2

See this example of a simple circle class with a prototype area method:

var Circle = function(radius) {
    this.radius = radius;
}

Circle.prototype.area = function() {
   return Math.PI*this.radius*this.radius;
}

What's the difference between the area function declared above and if it were just declared as a public method of the Circle in the first place? Either way, individual instances of circle have their own area, do they not? What's the difference??

this.area = function(){return Math.PI*this.radius*this.radius;}
Corey
  • 5,733
  • 2
  • 21
  • 37
temporary_user_name
  • 30,801
  • 41
  • 120
  • 186

3 Answers3

3

this.area = function(){} creates a new function and assigns it to the area property of this. Circle.prototype.area = function(){} creates a function once, and assigns it to the prototype of objects created by the Circle() constructor.

Francis Avila
  • 29,546
  • 6
  • 54
  • 93
3

If you declare it within the constructor then every instance of Circle will have a separate copy of the function. This would just be a waste of resources, since all Circle objects could share the same code.

Ted Hopp
  • 222,293
  • 47
  • 371
  • 489
  • But I have also read that prototype properties don't have access to local variables-- this seems like an unfavorable combination. Is there a way to create a single method which *does* have access to local variables? – temporary_user_name Feb 20 '13 at 19:35
  • What do you mean by "local variables"? – Francis Avila Feb 20 '13 at 19:37
  • In the duplicate question, the top answerer says "On the flip side of the coin, public methods have access to "private" variables, which isn't possible with inherited methods." – temporary_user_name Feb 20 '13 at 19:39
  • (I meant private, not local. Slip of the keyboard.) – temporary_user_name Feb 20 '13 at 19:42
  • @Aerovistae: "Local" is the correct term, not "private". Your example has no local variables in the constructor, so non-issue in that case. – the system Feb 20 '13 at 19:46
  • By definition, no, since the scope of a JS function is lexically-defined. What he calls "private" variables are closed-over objects in the constructor, so a function that closes over them has to have access to them when the function is created. – Francis Avila Feb 20 '13 at 19:47
  • That said plenty of very powerful languages (e.g. Python) do not make a habit of using "private" object members and just assign a property with an underscore prefix if they don't want a user to rely on it. No reason you couldn't do that instead. – Francis Avila Feb 20 '13 at 19:53
  • OH are we talking about NON `this.x` variables?? As in, just plain old `var x= 5`, that sort of thing? Of course `prototype` wouldn't have access to any of those declared inside the initial function definition... – temporary_user_name Feb 20 '13 at 19:53
  • @Aerovistae - A lot (perhaps all) of this private variables access can be done with closures without giving up the benefits of defining instance methods in the constructor prototype. For instance, you can wrap the entire definition in an [IIFE](http://benalman.com/news/2010/11/immediately-invoked-function-expression/). – Ted Hopp Feb 20 '13 at 20:18
1

this points to an instance of the function object, .prototype "points" to the function constructor that created the instances ( there is only one ). Normally in classical inheritance a class creates object instances. But in JavaScript because there are no classes a "function constructor" creates object instances. Sometimes I hear people say "function object" as well.