Simple JavaScript Inheritance with instance variables

Question

I'm trying to use: Simple Javascript Inheritance by John Resig

What I find really limited is the fact that the variables are not private to an instance of the object. This simple fact is one of the key factor for which a person would choose to adopt this kind of approach.

I've seen in the comments in the linked page that someone is suggesting the following:

init: function() {
  // Private var
  var _div = $( div );
  // Priviledged method accesses private var
  this.getDiv = function () { return _div; }
  this.setDiv = function (div) { _div = div; }
  // other initialization stuff
}

I have some doubts about this approach:

In the class I'm declaring, will I need to access this variables always through setter and getter?
How can I use this variables in the definition of inner functions?

Let's say for example:

node.append("title").text(function(d) { /* use private variable */ });

Has someone overcame this limitation?

Thanks and best regards

Sergio

Alex Wayne · Accepted Answer · 2014-02-06 10:13:49Z

Javascript really doesn't do private instance variables very well. It's possible to rig up, but it's hairy. In order to really do it, you have to create all your methods in the initializer.

var Foo = function() {
  var bar = 9;

  this.squarePrivate = function() {
    return bar * bar;
  };
}

new Foo().squarePrivate() //=> 81

This means that each function must be created in the scope of the instance constructor, so it has access to those local vars. So instantiating objects is slower.

If you use a class based or prototype style approach like you are doing, you can't really do private instance variables well.

Using getter/setter methods created in the constructor can work, but those getters and setters are public, so it won't allow you to hide the value, only wrap its get and set with logic. If you keep the getter and setter as you have them, there is no point in making them private.

A common convention is to prefix private properties with an underscore, which tells people not to mess with it. But if exposing the data is a security concern, this is obviously a bad idea.

init: function() {
  this._bar = 9; // people will see instance._bar, but get the hint not to touch
},
squarePrivate: function() {
  return this._bar * this._bar;
}

But the answer your questions:

In the class I'm declaring, will I need to access this variables always through setter and getter?

Yes. Only the init function has access to the local variable, so the setter and getter functions created in that scope also can access that local variable. But that local variable wont be accessible elsewhere, so you must use the getters/setters.

How can I use this variables in the definition of inner functions?

Well here's the whole problem. If you are using public getters, call them, but this means that data is effectively public. Or if you go with my first example, just reference the local var. Or if you use an underscored property, just reference it.

Sergio Arrighi · Accepted Answer · 2014-02-07 08:48:28Z

first of all thank you Alex for your kind reply. It took me some time to digest all the things you though me.

I want to answer my onw question though cause I had specific needs and I don't feel like the question was well posed at first.

Let's add as well that data isolation is not a concern, since in my application I will create instances of a hierarchy dinamically and invoke a method on them. People will eventually need to provide new implementations of the "root" object and my application will use them when needed.

I actually made some tests and made sure that the variables declared in the init method like this:

this._instanceVar

are actually owned by the instance itself. In other methods declared in the class I can access them by simply referencing them like that.

For the second point instead, I found a solution which doesn't appeal me completely but to which I will stick. The point is to copy this into a variable local with respect to the closure of the method I'm declaring. This variable will allow me to pass things to inner functions:

for example:

var Person = Class.extend({
    init: function() {
        this._name;
    },
    printNameOnClick: function() {
        var thiz = this;
        document.getElementById('nameDiv').addEventListener("click", function() {
            document.getElementById('nameDiv').innerHTML = thiz.name;
        });
    }
}

Or whaterver.

The whole point of this though it was to be able to instanciate dinamically an instance of a particular object on which to call a single method. A hierarchical model allows me to be sure that at list the function in the top class will be invoked.

Best regards,

Sergio

Collectives™ on Stack Overflow

Simple JavaScript Inheritance with instance variables

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related