JavaScript: How To Get Private, Privileged, Public And Static Members

After reading JavaScript inheritance - how and why and Explaining JavaScript scope and closures, I thought we’d combine the knowledge gained to talk about private, privileged, public and static members (properties and methods) for objects in JavaScript.

Background

For the developers coming from a heavy object-oriented background, defining and using these sort of members is key to all code being written. Not really so when you work with JavaScript, but I thought I’d explain how to use that sort of approach with JavaScript to make your code more versatile.

Putting together our object

We will put together a constructor object, of which you can create new instances by using the new keyword. Let’s start with an empty one, to get a hang of it:

// Constructor
function Kid (name) {
	// Empty, for now
}

Now you can create as many kid objects you want, in this fashion:

var kenny = new Kid("Kenny");

Adding a private property

As we learned in the JavaScript scope and closures article, by declaring a variable within a function, it is only available from within there. So, if we want a private property of the Kid object, we do it like this:

// Constructor
function Kid (name) {
	// Private
	var idol = "Paris Hilton";
}

The idol property will only be available for the code inside the Kid function/object.

Adding a privileged method

A privileged method is a method having access to private properties, but at the same time publicly exposing itself (in JavaScript, also due to JavaScript scope and closures). You can delete or replace a privileged method, but you cannot alter its contents. I.e. this privileged method returns the value of a private property:

// Constructor
function Kid (name) {
	// Private
	var idol = "Paris Hilton";

	// Privileged
	this.getIdol = function () {
		return idol;
	};
}

Adding a public property and a public method

Now that we have private and privileged members out of the way, let’s look at the very basic nature of public properties and methods:

// Constructor
function Kid (name) {
	// Public
	this.name = name;
	this.getName = function () {
		return this.name;
	};
}

The property name is publicly available for any call, just like the getName method is.

Update

Just as mentioned in the comments below, this way was only chosen and shown for clarity in comparison to the other types. The recommended way for public methods is using the prototype approach, and I’ve updated the code below to reflect that. E.g:

// Constructor
function Kid (name) {
	// Public
	this.name = name;
}
Kid.prototype.getName = function () {
	return this.name;
};

 

Read more about it in JavaScript inheritance - how and why.

Adding a static property

A static member is shared by all instances of the class as well as the class itself (i.e. the Kid object), but it is only stored in one place. This means that its value is not inherited down to the object’s instances:

// Constructor
function Kid (name) {
	// Constructor code
}

// Static property
Kid.town = "South Park";

Our complete object

Let’s take a look at our complete object, before we try accessing its properties and methods:

// Constructor
function Kid (name) {
	// Private
	var idol = "Paris Hilton";

	// Privileged
	this.getIdol = function () {
		return idol;
	};

	// Public
	this.name = name;
}

// Public
Kid.prototype.getName = function () {
	return this.name;
};

// Static property
Kid.town = "South Park";

Creating an instance and checking access

Now, finally, it’s time to test how these different approaches work in practice. We start by creating an instance of the Kid object, and then test what different values we get back. The tests and their results are:

// Create a new instance

var cartman = new Kid("Cartman");

// Access private property
cartman.idol; // undefined

// Access privileged method
cartman.getIdol(); // "Paris Hilton"

// Access public property
cartman.name; // "Cartman"

// Access public method
cartman.getName(); // "Cartman"

// Access static property on an instance
cartman.town; // undefined

// Access static property on the constructor object
Kid.town; // "South Park"

Conclusion

I hope this has been a good way to pique your curiosity about your different options when it comes to objects and its members! Also, for those new to JavaScript, but experienced in object-oriented programming with other languages, hopefully this answered some of the questions you might have had.