Question

20

JavaScript Classes and Variable Scope

rated 0 times [ 21] [ 1] / answers: 1 / hits: 26742 / 15 Years ago, mon, november 30, 2009, 12:00:00

I'm relatively new to JS and I'm having issues properly emulating OOP principles.

I guess I have two questions. Question the first is regarding the many ways to declare variables.

Say I have a class:

function clazz(a)

{

    this.b = 2;

    var c = 3;

    this.prototype.d = 4; // or clazz.prototype.d = 4?

}



var myClazz = new clazz(1);

Am I correct in the following assessments:

a is a private variable that is instance specific (i.e. different instances of clazz will have unique and independent variables 'a'). It can be accessed from within clazz as: 'a'.

b is a public variable that is instance specific. It can be accessed from within clazz as 'this.b' and from outside clazz as 'myClazz.b'.

c is a private variable that is static, or class specific (i.e. different instances of clazz will share the same 'c' variable). It can be accessed from within any instance of clazz as 'c' and changes in instance of clazz are reflected in all instances of clazz.

d is a public variable that is static/class specific. It can be accessed from anywhere via 'clazz.prototype.d' or 'myClazz.prototype.d'.

The overall issue I have with my understanding of the variable scheme is that there's no way to declare a private variable that is NOT static (i.e. a unique version for every instance of the class).

The second question is with respect to different types of class declarations.

I've been using:

var MySingleton = new function() {...};

to create singletons. Is this correct? I'm also unsure as to the effect of the new keyword in this situation as well as appending () function braces to the end of the declaration as so:

var MySingleton = new function() {...}();

I've been using this pattern to declare a class and then instantiate instances of that class:

function myClass() {...};

var classA = new myClass();

var classB = new myClass();

Is this the proper method?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

stephonkeandrer

Add To Favorites

Follow

Total Points: 392

Total Questions: 94

Total Answers: 100

Location: Tajikistan

Member since Sun, Aug 29, 2021

3 Years ago

stephonkeandrer questions

1 Electron: how to open an url in the same window and after the user do some action go back to application in the same window

Thu, Mar 24, 22, 00:00, 2 Years ago

1 How to disable scroll on body when fullscreen menu open

Sun, Jun 28, 20, 00:00, 4 Years ago

1 How databind a textarea component text value and update it?

Tue, Jun 9, 20, 00:00, 4 Years ago

1 Angular; how to re-render component data when I update variable in script. Binding data is working, but not updating

Mon, May 4, 20, 00:00, 4 Years ago

1 Loading module was blocked because of a disallowed MIME type (“application/wasm”)

Sun, Oct 13, 19, 00:00, 5 Years ago

View All

answered 15 Years ago admin · Accepted Answer

You are right for a and b:

a is an argument, available only within the scope of the constructor function.

bis a public instance variable, available on all instances created with that constructor function.

c is a private variable, accessible only within the constructor function.

The d declaration is invalid, because the prototype object is meant to be used only on constructor functions, like Clazz.prototype.d = 3;, if you do it like this, the variable will be shared, but you can assign a value on an specific instance, and the default value will be shadowed (through the prototype chain).

For private variables you can use the way you declare c, for example:

function Clazz(){

    var c = 3; // private variable



    this.privilegedMethod = function () {

      alert(c);

    };

}

Privileged methods, are public, but they can access private variables declared inside the constructor function.

For creating singletons, the easiest way is maybe to use an object literal, like:

var myInstance = {

  method1: function () {

    // ...

  },

  method2: function () {

    // ...

  }

};

And if you want private members on your singleton instance, you can:

var myInstance = (function() {

  var privateVar = '';



  function privateMethod () {

    // ...

  }



  return { // public interface

    publicMethod1: function () {

      // all private members are accesible here

    },

    publicMethod2: function () {

    }

  };

})();

This is has been called the module pattern, it basically allows you to encapsulate private members on an object, by taking advantage of the use of closures.

More info:

Private Members in JavaScript

Introduction to Object Oriented JavaScript

Edit: About the syntax you post:

var mySingleton = new (function() {

  // ...

})();

By using the new operator, you are declaring and using in one step an anonymous constructor function, which will generate a new object instance, it is valid but I personally would prefer the module pattern approach, to create my own object instance (and avoid new).

Also, reading new function () {}, I think that is not really intuitive and may create confusion, if you don't understand well how the new operator works.

About the parentheses, they are optional, the new operator will call the function constructor without parameters if you don't add them (see ECMA-262, 11.2.2).