0

What is the difference of inheritance definition of the two ways below

function Rectangle(w,h){
   this.width=w;
   this.height.h;
   this.area=function(){return this.width*this.height;}
}

and

function Rectangle(w,h){
   this.width=w;
   this.height.h;

}
Rectangle.prototype.area=function(){return this.width*this.height;} 

I saw somebody said the first way is inefficient of use regular properties for methods that are intended to be shared by all objects of the same class.

Welcome any comment

arachide
  • 8,006
  • 18
  • 71
  • 134

2 Answers2

1

The first way, you could use w and h directly inside the area function, equals to use them as private variable.

function Rec(w,h) {
    this.setW=function(newW){
        w=newW;
    }
    this.area=function(){
        return w*h;
    }
}

var rec=new Rec(5,6);

you cannot do alert(rec.w), or rec.w=5. since there is no this.w inside the class. but you can do

rec.setW(2);   
alert(rec.area());

this will alert 12.

http://jsfiddle.net/vanessachem/Hmyyc/ like this. w and h could be treat private variable. they could only be reset via a setter function inside the class.

It is inefficient when you need to create multiple instance. If you just want to create singleton, the first one is easy to manage.

The advantage of the second one is that you could put prototype function inside different file. It is good for multiple instances. However, you cannot treat w and h as private variable. You can't use w or h directly in the area function.

Linghua Jin
  • 570
  • 2
  • 6
  • 22
  • 1
    In both ways, `w` and `h` are *not* private. – Ja͢ck May 17 '13 at 01:46
  • 1
    For private variable that I understand, function inside the class could use variable like w or h, while the object instance can't access w or h. In way1, function inside the class could use w and h( not width and height). But in way2, function inside the class could not access w and h. – Linghua Jin May 17 '13 at 01:52
  • There's nothing private about it, they're function parameters. – Ja͢ck May 17 '13 at 01:58
  • 1
    Rectangle(w,h){this.area=function(){return w*h;}} then you cannot access w or h when you create an instance, but for the second one, when you create an instance, you can access w and h via width and height... – Linghua Jin May 17 '13 at 02:16
  • Yeah, but you really shouldn't do that because it would always reference the *old* values rather than the current ones, which basically makes the argument moot. – Ja͢ck May 17 '13 at 02:22
  • 1
    http://jsfiddle.net/vanessachem/Hmyyc/ You could change the value via a setter function. but you cannot directly modify it via the instance. – Linghua Jin May 17 '13 at 02:39
  • 1
    Since there is no this.w or this.h inside class, w and h will always be the current value when you create a instance. – Linghua Jin May 17 '13 at 02:40
0

The first way, every time you construct a new Rectangle, you also create a new anonymous function and assign it to this.area. The second way is more efficient if you are going to be constructing more than one Rectangle, because the anonymous function is still only created once, and all Rectangles have access to it, via their prototype.

Paul
  • 139,544
  • 27
  • 275
  • 264
  • Not sure the term "anonymous function" is useful here. The statement is an assignment of a [*FunctionExpression*](http://www.ecma-international.org/ecma-262/5.1/#sec-13) to an object property. The formal name is optional (and in this case not useful), but it's not really "anonymous". – RobG May 17 '13 at 02:15