We Keep Coding

Declare a public "static" function inside a JavaScript class

Suppose I need to declare some private static members to use it in some public static methods...
// ***** Variant I *****
function supports() {
var impl = document.implementation; // private, non-static
this.SVG = function () { // public, non-static
return impl.hasFeature("http://www.w3.org/TR/SVG11/feature#Image", "1.1");
};
}
// ***** Variant II *****
function supports() { }
supports.prototype.impl = document.implementation; // public, non-static
supports.SVG = function () { // public, static
return impl.hasFeature("http://www.w3.org/TR/SVG11/feature#Image", "1.1");
};
I know there are some difficulties in JavaScript with the 'static' OOP concept, so my question about is:
Can I declare public static methods inside the "declaration body" of the 'object' (like in the "Variant I" above)?

There is no private, static or public in JavaScript. There is only local and global, in-scope and out-of-scope. Use an IIFE to capture a variable and return a closure; this should work equivalently to a static method.
var supports = (function supportsWrapper() {
var impl = document.implementation; // "static"-ish.
return function supports() {
this.SVG = function () {
return impl.hasFeature("http://www.w3.org/TR/SVG11/feature#Image", "1.1");
};
}
})();
impl will be initialised only once, and will be readable only by supports, but will persist between calls to it.

In your Variant II the function that is supposedly private and static is neither private nor static.
You are correct that it is quite difficult to define a private static member of the class, but it is possible if you exploit JavaScript's scope.
var Person = (function(){
var privateStaticProperty = true;
function privateStatic() {
return privateStaticProperty;
}
function Person(){
// class declarations
}
Person.prototype.example = function() {
return privateStatic();
}
return Person;
}());
var p = new Person();
console.log(p.example());
Note, however, that if you extend the prototype outside of the closure, the supposedly private static members will not be available.

In JavaScript, there is no term or keyword static, but we can put such data directly into function object (like in any other object).
Static methods
Static methods, just like variables, are attached to functions. They are used mostly for objects:
function Animal(name) {
arguments.callee.count = ++arguments.callee.count || 1
this.name = name
}
Animal.showCount = function() {
alert( Animal.count )
}
var mouse = new Animal("Mouse")
var elephant = new Animal("elephant")
Animal.showCount() // 2

The only solution I see after analyzing some answers is this one:
var Person = (function () {
var _privateStatic = 'private static member';
function privateStatic() {
return _privateStatic + ' + private-s-function';
}
function Person() {
this.publicNonStatic = 'public, non-static member';
this.publicFunction = function () {
return this.publicNonStatic + '+ public non-static-function';
}
var _privateNonStatic = 'private, non-static member';
function privateNonStatic() {
return _privateNonStatic + " + private-ns-function"
}
this.publicStatic = Person.publicStatic = 'public static member';
this.publicStaticFunction = Person.publicStaticFunction = function () {
return Person.publicStatic + ' + public static function';
}
// Accessible internal
var test = _privateNonStatic;
test = _privateStatic;
test = privateStatic();
test = privateNonStatic();
// other class declarations
}
return Person;
}());
// Accessible external members:
var p = new Person();
console.log(p.publicFunction());
console.log(p.publicNonStatic);
console.log(p.publicStatic);
console.log(p.publicStaticFunction());
console.log(Person.publicStatic);
console.log(Person.publicStaticFunction());
PS.
I remarked however that publicStaticFunction() becames accesible only after a new Person() declaration... so, before it they are not available:
// Accessible external members:
console.log(Person.publicStatic); // NO WAY
console.log(Person.publicStaticFunction()); // NO WAY
var p = new Person(); // lazy declaration
console.log(Person.publicStatic); // IS OK!
console.log(Person.publicStaticFunction()); // IS OK!
, so I suppose there is no way to achieve it INSIDE the function Person body, only inside the anonymous function that wraps the Person...
So the initial SVG sample should be like this:
var supports = (function(){
function supports() { this.SVG = supports.SVG; }
supports.SVG = function () {
return document.implementation.hasFeature("http://shortened", "1.1");
};
return supports;
}());
// usage of public, static method
if (supports.SVG()) {return 'supports SVG!';}

How to implement inheritance in JS Revealing prototype pattern?

How do I inherit/extend classes that are using the Revealing Prototype pattern?
And is there a way to make the private variables and functions protected?
Example base object:
myNameSpace.Person = function() {
this.name= "";
this.id = 0;
};
myNameSpace.Person.prototype = function(){
var foo = function(){
//sample private function
};
var loadFromJSON = function (p_jsonObject) {
...
};
var toJSON = function () {
...
};
var clone = function (p_other) {
...
};
return {
loadFromJSON : loadFromJSON,
toJSON: toJSON,
clone: clone
};
}();

There are no protected variables/properties in JavaScript. Though, you can reuse "private" variables when you declare the inheriting classes in the same scope, which seems possible in your case when the private variables are only "hidden utilities" of your prototype.
MyNamespace.Person = function Person(params) {
// private variables and functions, individual for each Person instance
var anything, id;
function execute_something() {}
// public properties:
this.name = "";
this.getId = function getId(){
// called a "privileged function", because it has access to private variables
}
}
MyNamespace.American = function(params) {
MyNamespace.Person.call(this, params); // inherit name and getId()
}
(function() { // new scope for
// hidden utility functions and other private things
function foo() { }
function helpJSON() { }
function fromJSON() { }
var bar;
(function(personProto) { // new scope for prototype module (not explicitly needed)
// "private" /static/ variables (and functions, if you want them private)
var personCount = 0;
personProto.clone = function clone() {
return this.constructor(myself); // or something
};
personProto.toJSON = function toJSON() {
// use of helpJSON()
};
personProto.fromJSON = fromJSON; // direct use
})(MyNamespace.Person.prototype);
(function(amiProto) {
// just the same as above, if needed
amiProto.special = function() {
// use foo() and co
};
})( MyNamespace.American.prototype = Object.create(MyNamespace.Person.prototype) );
})();
This is the JavaScript way of inheritance, which means American's prototype inherits the clone(), toJSON() and fromJSON() functions automagically from the Person's prototype. Of course overwritable. And the feature is
new MyNamespace.American() instanceof MyNamespace.Person; // true
Of course, if you don't need that, and want use the more module-like way, you could reuse the utility functions, i.e. just copy them:
(function() {
// hidden utility functions and other private things
var bar;
var personCount;
function foo() { }
function helpJSON() { }
function fromJSON() { }
function clone() {
return this.constructor(myself); // or something
}
function toJSON() { }
(function(personProto) { // new scope, not really needed
// private variables are useless in here
personProto.clone = clone;
personProto.toJSON = toJSON;
personProto.fromJSON = fromJSON;
})(MyNamespace.Person.prototype);
(function(amiProto) { // new scope, not really needed
// copied from personProto
amiProto.clone = clone;
amiProto.toJSON = toJSON;
amiProto.fromJSON = fromJSON;
// and now the differences
amiProto.special = function() {
// use foo() and co
};
})(MyNamespace.American.prototype);
})();

Is this method of creating objects only applicable for singleton objects?

I was going through some code written by Douglas Crockford. He uses the below structure to create objects.
var obj = (function(){
var x, y, z; // These are private fields
// This is private method
function func1() {
}
return {
// This is public method
init : function() {
}
};
}());
I like this way as opposed to the constructor functions like below.
function Obj() {
// Uses __ to denote private
this.__x = 0;
this.__y = 0;
this.__z = 0;
// Private method
this.__func1 = function() {
};
// Public method
this.init = function() {
}
}
var obj = new Obj();
I don't like the constructor function method as you need to use __ for denoting private fields or methods (and this does not really make the field private) and you need to use this keyword for accessing any field or method. I like the first method but I don't know how to define multiple objects using it.
Can we define multiple objects in the first method or it can only be used for creating singleton objects?

To instantiate new objects you need to use the new keyword that needs to use a function as a constructor. I see 2 options:
Return a function instead of object literal in your function:
var obj = (function(){
var x, y, z; // These are private fields
// This is private method
function func1() {
console.log("func1");
}
return function() {
// This is public method
this.init = function() {
func1();
}
};
})();
Or don't use a self executing function:
var obj = function(){
var x, y, z; // These are private fields
// This is private method
function func1() {
console.log("func1");
}
return {
// This is public method
this.init = function() {
func1();
}
};
};
Both let's you do var newObj = new obj(). Not sure what are the implications between the two but I normally just use a function.

Just a note that:
this.__x
does not make x private (except possible by convention, i.e people learn not to use that)
rather:
function Obj() {
// private
var x = 0;
var __y = 0;
// public
this.z = 0;
// Private method
function func1() {
};
// Public method
this.init = function() {
}
}
I found this link helpful: http://www.phpied.com/3-ways-to-define-a-javascript-class/

How to make a JavaScript singleton with a constructor without using return?

I currently know two ways to construct singletons in JavaScript. First:
var singleton = {
publicVariable: "I'm public",
publicMethod: function() {}
};
It is perfect except that it does not have a constructor where I could run initialization code.
Second:
(function() {
var privateVariable = "I'm private";
var privateFunction = function() {}
return {
publicVariable: "I'm public",
publicMethod: function () {}
}
})();
The first version does not have private properties nor does it have a constructor, but it is faster and simpler. The second version is more complex, ugly, but has a constructor and private properties.
I'm not in a need for private properties, I just want to have a constructor. Is there something I am missing or are the two approaches above the only ones I've got?

function Singleton() {
if ( Singleton.instance )
return Singleton.instance;
Singleton.instance = this;
this.prop1 = 5;
this.method = function() {};
}​

Here is my solution with closures:
function Singleton() {
Singleton.getInstance = (function(_this) {
return function() { return _this; };
})(this);
}
Test:
var foo = new Singleton();
var bar = Singleton.getInstance();
foo === bar; // true

If you are just looking for a place to initialise your singleton, how about this?
var singleton = {
'pubvar': null,
'init': function() {
this.pubvar = 'I am public!';
return this;
}
}.init();
console.assert(singleton.pubvar === 'I am public!');
Simple and elegant.

var singleton = new function() { // <<----Notice the new here
//constructorcode....
this.publicproperty ="blabla";
}
This is basically the same as creating a function, then instantly assiging a new instace of it to the variable singleton. Like var singleton = new SingletonObject();
I highly advice against using singletons this way in javscript though because of the execution order is based on where in the file you place the object and not on your own logic.

What about this?
var Singleton = (function() {
var instance;
// this is actual constructor with params
return function(cfg) {
if (typeof instance == 'undefined') {
instance = this;
this.cfg = cfg;
}
return instance;
};
})();
var a = new Singleton('a');
var b = new Singleton('b');
//a === b; <-- true
//a.cfg <-- 'a'
//b.cfg <-- 'a'

I make it an actual Singleton with static functions and no this like so:
class S {
//"constructor"
static init() {
//Note: Since it's a singleton, there's no "this" instance.
//Instead, you store variables directly on the class.
S.myVar = 7;
}
static myOtherFunc() {
alert(S.myVar);
}
}
//Immediately call init() to make it the "constructor".
//Alternatively, you can call init() elsewhere if you'd
//like to initialize it at a particular time.
S.init();
//Later:
S.myOtherFunc();
S.myVar = 10;

Private static functions in javascript

How can I create a function that can't be called from outside?
var obj = {
function1: function(){
alert("function1");
},
function2: function(){
alert("function2...");
obj.function1();
}
};
// so how to make this function unaccessible
obj.function1();
// and you could only call this function
obj.function2();

You may want to consider using the Yahoo Module Pattern. This is a singleton pattern, and the methods are not really static, but it may be what you are looking for:
var obj = (function () {
//"private" variables:
var myPrivateVar = "I can be accessed only from within obj.";
//"private" method:
var myPrivateMethod = function () {
console.log("I can be accessed only from within obj");
};
return {
myPublicVar: "I'm accessible as obj.myPublicVar",
myPublicMethod: function () {
console.log("I'm accessible as obj.myPublicMethod");
//Within obj, I can access "private" vars and methods:
console.log(myPrivateVar);
console.log(myPrivateMethod());
}
};
})();
You define your private members where myPrivateVar and myPrivateMethod are defined, and your public members where myPublicVar and myPublicMethod are defined.
You can simply access the public methods and properties as follows:
obj.myPublicMethod(); // Works
obj.myPublicVar; // Works
obj.myPrivateMethod(); // Doesn't work - private
obj.myPrivateVar; // Doesn't work - private

The simple answer is that you can't do both. You can create "private" methods or "static" methods, but you can't create Private static functions as in other languages.
The way you can emulate privacy is closure:
function f() {
function inner(){}
return {
publicFn: function() {},
publicFn2: function() {}
}
}
Here because of closure, the inner function will be created every time you call f, and the public functions can acces this inner function, but for the outside world inner will be hidden.
The way you create static methods of an object is simple:
function f() {}
f.staticVar = 5;
f.staticFn = function() {};
// or
f.prototype.staticFn = function() {};
Here the function object f will only have one staticFn which has access to static variables, but nothing from the instances.
Please note that the prototype version will be inherited while the first one won't.
So you either make a private method that is not accessing anything from the instances, or you make a static method which you doesn't try to access from the outside.
​

You can use a closure, something along the lines of....
var construct = function() {
var obj = {};
var method1 = function() {
alert("method1");
}
obj.method2 = function() {
alert("method2...");
method1();
}
return obj;
}
obj = construct();
Then:
obj.method2 is accessible, but obj.method1 doesn't exist for public usage. It can be only accessed using member functions of the class.

Objects can be produced by constructors, which are functions which initialize objects. Constructors provide the features that classes provide in other languages, including static variables and methods.
Read all about it at http://www.crockford.com/javascript/private.html

You can do it like this:
var obj = new function() {
var method1 = function() { // private }
this.method2 = function() { // public }
}
obj.method1(); // not possible
obj.method2(); // possible
Note that I also use an anonymous constructor. This is sort of analogous to the Singleton pattern.

Maybe you want a proxy object containing only the public methods, e.g.
var obj = (function() {
var obj = {
method1: function(){
alert("method1");
},
method2: function(){
alert("method2...");
obj.method1();
}
}
return {
method2: function() { return obj.method2.apply(obj, arguments) }
}
})()
// you could only call this function
obj.method2();
// this function inaccessible
obj.method1();
I don't see the point of private methods in javascript. If you don't want people calling a method then don't advertise it. Private methods also make debugging just that bit harder too.

This is how it really should be done.
var MyClass = new(function() {
var privateStaticVariable = '';
function privateStaticMethod() {
}
function construct() {
var self = this;
this.publicMethod = function() {};
function privateMethod() {
//maybe lest use our private static method
privateStaticMethod();
}
}
construct.publicStaticVariable = '';
construct.publicStaticMethod = function() {};
return construct;
})();
Now lets use it:
var myClass = new MyClass();.....
MyClass.publicStaticMethod();
MyClass.publicStaticVariable = 'sfdsdf';
myClass.publicMethod();
.....

Use class. Though some of the features are still not shipped as it’s at Stage 3.
const instance = new (class Alpha {
static #private_static_method() {
console.info("I am private and static.");
}
static public_static_method() {
Alpha.#private_static_method();
console.info("I am public and static.");
}
#private_nonstatic_method() {
console.info("I am private and non-static.");
}
public_nonstatic_method() {
this.#private_nonstatic_method();
console.info("I am public and non-static.");
}
});
instance.constructor.public_static_method();
// instance.constructor.#private_static_method(); // impossible
instance.public_nonstatic_method();
// instance.#private_nonstatic_method(); // impossible