Multiple files using a single javascript prototype that uses object literal [duplicate]

Question

Basically, I found the javascript library where the API uses some object literal. I am trying to figure out how to separate them on different javascript files for easier reading. There is the file that has like 30 different functions nested in a single object... I am trying to separate them. The example below is simplified to show my point.

BasicGame.Game.prototype = {

var1: function () { blah blah},
var2: function () { blah blah},
var3: function () { blah blah},
var4: function () { blah blah}
}

How an you take out var3 and var4 and put in them in another object literal that shares same Basic.Game object? If I wrote BasicGame.Game again, it would overwrite the original object literal.

possible duplicate of Defining a Javascript prototype and Is it possible to split huge javascript file by few smaller files preserving its structure? — Bergi
– Bergi, Commented Feb 19, 2014 at 15:08

Overv · Accepted Answer · 2014-02-19 15:04:09Z

2

You can write BasicGame.Game.prototype.var3 = function() { } in another file and it won't overwrite the functions already in there.

For example, file1.js:

BasicGame.Game.prototype = {
    var1: function () { blah blah},
    var2: function () { blah blah}
}

And file2.js:

BasicGame.Game.prototype.var3 = function () { blah blah};
BasicGame.Game.prototype.var4 = function () { blah blah};

Just make sure that file1.js is included first or use the dot notation for both files.

answered Feb 19, 2014 at 15:04

Overv

8,5393 gold badges44 silver badges72 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user1142285 Over a year ago

That would work. But is it possible to make another object literal? Seems a bit inelegant to write BasicGame.Game.prototype.somevar over and over again.

Overv Over a year ago

@user1142285 You could store BasicGame.Game.prototype in a temporary variable and do proto.var3 = function() { bla blah }. The only alternative is using a library like jQuery to merge object literals.

Aviv Shaked · Accepted Answer · 2014-02-19 16:47:18Z

1

You can augment Object with the following code:

Object.defineProperty(Object.prototype, "partial", {
    enumerable: false,
    configurable: false,
    set: function (value) {
        if (value.constructor === Object) {
            for (prop in value) {
                if (value.hasOwnProperty(prop)) {
                    this[prop] = value[prop];
                }
            }
        }
        return this;
    },
    get: function () { return this;}
});

Then you can use this augment to add literals to any object like so:

//first file
BasicGame.Game.prototype = {

    var1: function () { alert("blah blah"); },
    var2: function () { alert("blah blah"); },
}

//second file
BasicGame.Game.prototype.partial = {

    var3: function () { alert("blah blah"); },
    var4: function () { alert("blah blah"); }
}

var game = new BasicGame.Game();

now game will show all four properties as they "shine through" its constructor's prototype.

edited Feb 19, 2014 at 16:47

answered Feb 19, 2014 at 16:27

Aviv Shaked

7623 silver badges8 bronze badges

1 Comment

user1142285 Over a year ago

Whoa, I am impressed by this.

Collectives™ on Stack Overflow

Multiple files using a single javascript prototype that uses object literal [duplicate]

2 Answers 2

2 Comments

1 Comment

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Linked

Related