We Keep Coding

How to inherit private variables in javascript with Object.create

I have this:
function Book (){
this.width = 7;
this.height = 10;
var pages = 100;
this.tear_page = function(){
return --pages;
}
}
function TechBook () {
var pages = 50;
this.open_book = function(){ return "Opened in page "+(pages/2); };
return this;
}
var bBook = Object.create(new Book(), new TechBook());
console.log(bBook);
console.log(bBook.tear_page());
console.log(bBook.open_book());
I can't get this to work. I got as far as getting TechBook to inherit the access to local/private variables from Book but only from the Book functions. If I add new methods or overwrite them, they can't get those variables any more. I wonder if there is a way to still have access to those variables from methods of the subclass and to create new private variables inside the subclass.
If this is not posible in any way, that would mean that you can't have private variables if you want inheritage, or viceversa. Oh, and btw, I know that chrome can now (thanks to ES6) implement classes naturally with: class TechBook extends Book (){} as many other languages, but as support is limited to last versions of chrome at this time... I wonder if there is any other way to solve this problem.

You can't inherit private in any language, only protected or public can be inherited.
That concept does not exist in javascript but u can emulate when creating an object (properties = public, scope things = private);
A work around could be add a property that execute a function that return the private variable/function of the object scope.
If expose a method that return a private object it can be modified because u have the returned reference.
I like to do it like this:
var SomeObject = function() {
//private var one, can't access it outside of this scope
var one = 1;
/*private object anotherObject, can't access it directly
but if you return it with a public function you can modify it.*/
var anotherObject = {
a : 'somevalue'
};
//public prop two, can access it outside of this scope.
this.two = 2;
//public method getOne, you can access it.
this.getOne = function() {
return one;
};
/* return private var anotherObject */
this.getAnotherObject = function() {
return anotherObject;
};
};
var someObject = new SomeObject();
console.log(someObject.two); // print in console 2
console.log(someObject.getOne()); // print in console 1
var referencedObject = someObject.getAnotherObject();
console.log(referencedObject);
referencedObject.a = 'anotherValue';
console.log(someObject.getAnotherObject());
Fiddle

Here is an example of how you might pass data by knowing a secret
function Book(secret) {
secret = secret || {};
var env = {}; // `env` to hold data requiring `secret`
this.width = 7;
this.height = 10;
env.pages = 100;
this.getEnv = function (s) { // give access to `env` if you know the secret
if (s === secret) return env;
};
this.tear_page = function () {
return --env.pages;
};
}
function TechBook(secret) {
secret = secret || {};
Book.call(this, secret); // construct from Book
var env = this.getEnv(secret); // get references via secret
this.open_book = function () {
return "Opened in page " + (env.pages/2);
};
}
TechBook.prototype = Object.create(Book.prototype); // set up inheritance
Using an Object reference as the secret will be more secure than using a primitive as you'll need the original reference for access.
Now you have
var bBook = new TechBook();
console.log(bBook); // instance of TechBook
console.log(bBook.tear_page()); // 99
console.log(bBook.open_book()); // Opened in page 49.5

Reference to fundamentals of prototype inheritance and Object.create property arguments.
Implemented based on your example
function Book (){
this.width = 7;
this.height = 10;
this.pages = 100;
this.tear_page = function(){
return --this.pages;
}
this.init = function() {
return this
}
}
Book.prototype = {
open_book: function(){ return "Opened in page "+(this.pages/2) }
}
var bBook = Object.create(new Book(), {pages: { value: 50 } }).init();
console.log( new Book()) // { width: 7, height: 10, pages: 100, tear_page: [Function], init: [Function] }
console.log( bBook ) //{}
console.log( bBook.width ) //->7
console.log( bBook.height ) //-> 10
console.log( bBook.pages ) // -> 50
console.log( bBook.tear_page()) //-> 49
console.log(bBook.open_book()) //-> Opened in page 25

using inheritance inside a namespace [duplicate]

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);
})();

How do you namespace objects in the Revealing Prototype Pattern?

I've been using the Revealing Module pattern and have several namespaces.
Example:
// here's the namespace setup
var myProject= myProject|| {};
var myProject.models= myProject.models || {};
myProject.models.MyModel= function(){
var someMethod = function(){
// do something
};
return{
SomeMethod = someMethod
};
}
I'm moving to the Revealing Prototype Pattern to gain some memory usage improvements and so I can decorate the object another function. How do I keep it in my myProject.models namespace?
This gives my JavaScript errors:
var myProject.models.MyModel= function(){
// properties here
};
myProject.models.MyModel.prototype = (function(){
// methods here
var someMethod = function(){
// do something
};
return{
SomeMethod = someMethod
};
}());

You have various syntax errors.
myProject = window.myProject|| {};
myProject.models = myProject.models || {};
myProject.models.MyModel = (function () {
//declare a constructor function
function MyModel() {
}
//declare a function that will be publicly available on each MyModel instances
MyModel.prototype.someFunction = function () {
//call the private function from within the public one
//note: you have to be careful here since the context object (this) will be
//window inside somePrivateFunction
somePrivateFunction();
//call the private function and set the context object to the current model instance
//somePrivateFunction.call(this);
};
//declare a private function
function somePrivateFunction() {
}
return MyModel; //return the model constructor
})();
Now you can use your model like:
var m = new myProject.models.MyModel();
m.someFunction();

var myProject = myProject || {};
^^^
You are using a var statement here to declare the global myProject variable (if it hasn't been already), so that it will not throw Undefined variable exceptions. (Also you initialise it to an empty object if it had now value)
var myProject.models= myProject.models || {};
In here, you are assigning the models property to the object from above. The var keyword is out of place here; remove it and it will work.
With myProject.models.MyModel = … you did it right in the upper snippet and wrong in the second one; I'm not sure which you were trying to use. The revealing prototype pattern should look like this:
var myProject = myProject || {};
myProject.models = myProject.models || {};
myProject.models.MyModel = (function(){
function MyModel() {
// instance properties here
}
function someMethod(){
// do something
}
MyModel.prototype.SomeMethod = someMethod;
// ^ lowercase that?
return MyModel;
})();

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);
})();

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;