#private variables

Private variables have always been possible in JavaScript, but before the new syntax they required somewhat cumbersome steps to use. For example:

function Car(name, hp) { const privateVariable = 'test1'; this.name = name; this.hp = hp; // Note this will not appear in inherited copies of this object. this.print = function() { console.log(`${this.name} (${this.hp}) - secret: ${privateVariable}`); } } const miata = new Car('miata', 155); console.log(miata.name); // miata console.log(miata.hp); // 155 console.log(miata.privateVariable); // undefined miata.print(); // miata (155) - secret: test1

Basically, private variables can be created in a scope that is no longer available and used via a closure. Now with the # syntax, this is much more straightforward:

class Car { #privateVariable = 'test1'; constructor(name, hp) { this.name = name; this.hp = hp; } print() { console.log(`${this.name} (${this.hp}) - secret: ${this.#privateVariable}`); } } const miata = new Car('miata', 155); console.log(miata.name); // miata console.log(miat2.hp); // 155 console.log(miata.privateVariable); // undefined miata.print(); // miata (155) - secret: test1

This is currently supported in Node.js 12 and Chrome by default. It will likely be in other browsers soon since it is now part of the JS standard.

Here are the five best posts of my blog in my opinion for this year. They vary from immediately useful techniques to just interesting ones that should not be used in production. In chronological order:

Simple Inheritance I always hear about the complexity of writing your own inheritance in JS, but by using the functional strategy it is actually quite obvious. Just keep in mind this strategy is inefficient performance wise

Private Variables A simple implementation of private variables.

Paren Free Function Calls According to most JS resources, JS functions require () to cause a function to be called. If you are using no arguments there is a way to exclude them. An fascinating implementation, but a bad idea in almost all production code.

Node Polyglots On UNIXy environments like Linux or Mac OS X it is convenient to run scripts like ./script. The same can be accomplished with Node.js scripts, but it requires combining a tiny bit of Bash with JavaScript in the same file.

After the last post, I want to explain something a little more practical. It is rare, especially in JavaScript, but sometimes direct access to a variable in an object can cause a lot of problems. For example, you are creating a remote file libary and it supports a limited number of protocols. When the user initializes the main libary object they specify the protocol and it throws an error if the specified protocol is not supported.

var remoteFile = function(protocol) { var self = this; self.protocol = protocol;// Make it changeable if (protocol !== 'http' && protocol !== 'ftp'){ throw(protocol + " is not supported"); } self.upload = function(file) { console.log('uploading',file,'using',self.protocol); }; self.download = function(remoteLocation, localLocation){ console.log( 'Downloading from', remoteLocation, 'to', localLocation, 'using', self.protocol ); }; return self; }; var remote = remoteFile('http'); remote.upload('test.csv'); remote.download('/downloads/test.csv', 'new.csv'); var remote = remoteFile('sftp');// throws an error

But now what if they want to change protocol without reinitializing. Since protocol is public they can change it anytime, but all your methods will now need to throw an incorrect protocol error. Unless access to protocol is restricted:

var remoteFile = function(_protocol) { var self = this; var protocol = _protocol; self.upload = function(file) { console.log('uploading', file, 'using', protocol); }; self.download = function(remoteLocation, localLocation){ console.log( 'Downloading from', remoteLocation, 'to', localLocation, 'using', protocol ); }; self.getProtocol = function() { return protocol; } self.setProtocol = function(_protocol) { if (_protocol !== 'http' && _protocol !== 'ftp'){ throw(_protocol + " is not supported"); } protocol = _protocol; } return self; }; var remote = remoteFile('http'); remote.upload('test.csv');// Uploading test.csv using http remote.setProtocol('ftp'); remote.upload('test.csv');// Uploading test.csv using ftp remote.setProtocol('sftp');// throws an error

This is a little less obscure than some posts, but it seems like a lot of developers are unaware of this. Note, that this same strategy can be used to create singletons and constants.

Notice this function inside the Sencha touch framework:

Ext.apply(Ext, { /** * Returns the current document body as an {@link Ext.Element}. * @ignore * @member Ext * @return Ext.Element The document body */ getHead : function() { var head; return function() { if (head == undefined) { head = Ext.get(document.getElementsByTagName("head")[0]); } return head; }; }() });

I like very much the private variable inside the function. No more need to define another variable inside the main object like this: