Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

javascript singleton question

I just read a few threads on the discussion of singleton design in javascript. I'm 100% new to the Design Pattern stuff but as I see since a Singleton by definition won't have the need to be instantiated, conceptually if it's not to be instantiated, in my opinion it doesn't have to be treated like conventional objects which are created from a blueprint(classes). So my wonder is why not just think of a singleton just as something statically available that is wrapped in some sort of scope and that should be all.

From the threads I saw, most of them make a singleton though traditional javascript

new function(){} 

followed by making a pseudo constructor.

Well I just think an object literal is enough enough:

var singleton = {
   dothis: function(){},
   dothat: function(){}
}

right? Or anybody got better insights?

[update] : Again my point is why don't people just use a simpler way to make singletons in javascript as I showed in the second snippet, if there's an absolute reason please tell me. I'm usually afraid of this kind of situation that I simplify things to much :D

like image 875
Shawn Avatar asked Dec 13 '09 05:12

Shawn


People also ask

What is a singleton in Javascript?

Singletons are used to create an instance of a class if it does not exist or else return the reference of the existing one. This means that singletons are created exactly once during the runtime of the application in the global scope. Based on this definition, singletons seem very similar to global variables.

Are Javascript modules singletons?

If you've worked with ES6 modules, and if you didn't already know it, ES6 modules are singletons by default. Specifically, by combining modules and the const keyword, you can easily write singletons.

What is getInstance in Javascript?

The getInstance method is Singleton's gatekeeper. It returns the one and only instance of the object while maintaining a private reference to it which is not accessible to the outside world. The getInstance method demonstates another design pattern called Lazy Load.

What is an example of a singleton?

Example. The Singleton pattern ensures that a class has only one instance and provides a global point of access to that instance. It is named after the singleton set, which is defined to be a set containing one element. The office of the President of the United States is a Singleton.


2 Answers

I agree with you, the simplest way is to use a object literal, but if you want private members, you could implement taking advantage of closures:

var myInstance = (function() {
  var privateVar;

  function privateMethod () {
    // ...
  }

  return { // public interface
    publicMethod1: function () {
      // private members can be accessed here
    },
    publicMethod2: function () {
      // ...
    }
  };
})();

About the new function(){} construct, it will simply use an anonymous function as a constructor function, the context inside that function will be a new object that will be returned.

Edit: In response to the @J5's comment, that is simple to do, actually I think that this can be a nice example for using a Lazy Function Definition pattern:

function singleton() {
  var instance = (function() {
    var privateVar;

    function privateMethod () {
      // ...
    }

    return { // public interface
      publicMethod1: function () {
          // private members can be accessed here
       },
      publicMethod2: function () {
        // ...
      }
    };
  })();

  singleton = function () { // re-define the function for subsequent calls
    return instance;
  };

  return singleton(); // call the new function
}

When the function is called the first time, I make the object instance, and reassign singleton to a new function which has that object instance in it's closure.

Before the end of the first time call I execute the re-defined singleton function that will return the created instance.

Following calls to the singleton function will simply return the instance that is stored in it's closure, because the new function is the one that will be executed.

You can prove that by comparing the object returned:

singleton() == singleton(); // true

The == operator for objects will return true only if the object reference of both operands is the same, it will return false even if the objects are identical but they are two different instances:

({}) == ({}); // false
new Object() == new Object(); // false
like image 83
Christian C. Salvadó Avatar answered Sep 17 '22 15:09

Christian C. Salvadó


I have used the second version (var singleton = {};) for everything from Firefox extensions to websites, and it works really well. One good idea is to not define things inside the curly brackets, but outside it using the name of the object, like so:

var singleton = {};
singleton.dothis = function(){

};
singleton.someVariable = 5;
like image 44
Marius Avatar answered Sep 18 '22 15:09

Marius