Question

I recently started using prototyping for a project. It is one of my first times using prototyping, so still finding my legs 🙂 I come from an object oriented background, so excuse me if some of my terminology is not correct.

One of my main reasons for using it is to create a scoping framework for the project, to avoid any conflicts later on. I also use it to allow me to create objects spread over several files.

I am however having trouble with something.

I declare my base “class” in one file. In another file, I then declare an extension to the class. In this extension I declare a function, which I then try to call from the base class. Lastly I declare an instance of the extension inside the base class to allow me to call the extended functions from the base class.

When I try and create the instance, however, I get the following error:

SCRIPT445: Object doesn’t support this action leave.js, line 2
character 5

Here is a snippet of my code:

leave.js

var _LEAVE = function () {
    this.WORK_LIST = new this._WORK_LIST();
}

worklist.js

_LEAVE.prototype._WORK_LIST = function (params) {
    var Render = function(){
         ...
    }
}

Any suggestions about what I am doing wrong and how to fix it would be greatly appreciated.

Answer 1

Alright, firstly if you don’t understand prototype-based inheritance then I suggest that you learn about it. It’s really simple actually.

Secondly, and please don’t take this in the wrong way – your code abhors me. I understand that you’ve come from a classical background and I respect the effort you’re making. However, truly speaking I wouldn’t want to read your code even if I was paid to.

This is what I would have done (correct me if my program isn’t what you’re looking for, but I really don’t know what’s happening in your code):

// baseClass.js

function BaseClass() {                       // class BaseClass
    var extendedObject = new Extension;
}

// extension.js

Extension.prototype = new BaseClass;         // Extension extends BaseClass
Extension.prototype.constructor = Extension; // reset the constructor property

function Extension() {                       // class Extension
    // some private variables

    var privateVar = null;
    function privateFunction() {}

    // some public properties

    this.publicVar = null;
    this.publicFunction = function () {};
}

In addition, since you’re from a classical background it may help you to write code that’s more in line with the classical style of inheritance. Read this answer. It will help you a lot.

Edit: Using my script you can create classes in JavaScript as follows.

baseClass.js:

/*
    class BaseClass {
        var extension;

        function constructor() {
            extension = new Extension;
        }
    }
*/

var BaseClass = new Class(function () {
    var extension;

    function constructor() {
        extension = new Extension;
    }

    return constructor;
});

extension.js:

/*
    class Extension extends BaseClass {
        var secret;

        function constructor() {
            secret = null;
        }

        this.getSecret = function () {
            return secret;
        };

        this.setSecret = function (newSecret) {
            secret = newSecret;
        };
    }
*/

var Extension = new Class(function () {
    var secret;

    function constructor() {
        secret = null;
    }

    this.getSecret = function () {
        return secret;
    };

    this.setSecret = function (newSecret) {
        secret = newSecret;
    };

    return constructor;
}, BaseClass);

You may tinker with the fiddle.