How to implement multiple new functions in Javascript object?

Question

I am doing some reading about class creation in Javascript. I know the concept does not exist in Javascript and that one can work with prototype.

I am trying to translate the following piece of code from Java to Javascript. Specifically, I want to have two constructors, one parameterless and one with two parameters:

public class MyClass {

    int width = 10;
    int height = 20;

    public MyClass() { };

    public MyClass(int w, int h) {

        this.width = w;
        this.height = h;

    };

    ...

}

As far as I understand, I need to define my 'class' as following in Javascript:

function MyClass() {

    this.width = 10;
    this.height = 20;

};

But, how do I define my second constructor? I want to be able to create instances of my class two ways:

var Instance1 = new MyClass();
var Instance2 = new MyClass(33,45);

Update:

Ok, I understand my constructors cannot have the same name, because Javascript cannot recognize the different parameter types. So, if I use different names for my constructors, how am I supposed to declare them? Is the following correct?

function MyClass() {

    this.width = 10;
    this.height = 20;

};

MyClass.prototype.New2 = function(w,h) {

    var result = new MyClass();

    result.width = w,
    result.height = h,

    return result;

};

possible duplicate of [How to overload constructor of an Object in JS (Javascript)?](http://stackoverflow.com/questions/4179283/how-to-overload-constructor-of-an-object-in-js-javascript) (Basically, you can't, but there's a workaround in that question) — Cerbrus, Feb 03 '14 at 10:14
I usually pass an object so the function chain (for example when inheriting) can read and mutate whatever value is relevant for that function. It is a little more verbose but makes the code better readable.http://stackoverflow.com/a/16063711/1641941 — HMR, Feb 03 '14 at 14:00

score 2 · Accepted Answer · answered Feb 03 '14 at 10:18

2

Javascript has no multimethods, therefore your only option is to parse arguments and act accordingly. A common idiom is to use || to check if an argument is "empty" (undefined or 0):

function MyClass(w, h) {
    this.width = w || 10;
    this.height = h || 20;
};

If 0 is a valid value in your context, check for undefined explicitly:

function MyClass(w, h) {
    this.width  = typeof w != 'undefined' ? w : 10;
    this.height = typeof h != 'undefined' ? h : 20;
};

Another option is to provide arguments as an object and merge it with the "defaults" object. This is a common pattern in jquery:

function MyClass(options) { 
  // set up default options 
  var defaults = { 
    width: 10,
    height: 20
  }; 

  var options = $.extend({}, defaults, options);

answered Feb 03 '14 at 10:18

georg

211,518
52
313
390

I understand my constructors cannot have the same name. I have updated my question. Is the new way to declare the second constructor a/the right way to proceed in Javascript? – Jérôme Verstrynge Feb 03 '14 at 10:26
@JVerstry: in general, `new` is considered non-idiomatic in js, see this [classic article](http://javascript.crockford.com/prototypal.html). – georg Feb 03 '14 at 13:28
Ok, I understand. I guess adding an options parameters with defaults inside the method is the best way to reproduce what I want without creating several functions. Thanks. – Jérôme Verstrynge Feb 03 '14 at 13:35

How to implement multiple new functions in Javascript object?

1 Answers1