Last week, we discussed the JSON format. Today we are going to take a deeper look in the object structure in JavaScript. In most object-oriented programming languages you have some kind of classical inheritance. This means that the language allows you to define a sort of blueprint of an object named a class. JavaScript doesn’t work with these concepts. Instead, it works with prototypes. The dynamic nature of JavaScript allows you to apply inheritance on object level instead of class level. Every object has a prototype object, you can set this prototype object and automatically you will be able to access properties or functions on the child object.
var parentObject = { x:1, y: 1 };
var childObject = { x: 2, a: 2 };
childObject.prototype = parentObject;
In the example above, the childObject has three properties: x, y and a. Whenever JavaScript is interpreted, the interpreter selects the first instance it finds of a property/function. So if we would look for the property x on childObject, we would find 2 instead of 1 because the childObject’s x definition is the first one the interpreter encounters.
In JavaScript native types also have a prototype object. That prototype contains all the methods you can use on the type. For example the String type has a prototype object that contains the following methods:
- String.prototype.charAt()
- String.prototype.slice()
- String.prototype.trim()
- String.prototype.split()
- String.prototype.toUpperCase()
These prototype methods are easy to use, you can just call them from the object, e.g. “lowercase”.toUpperCase(). Not only the String type has these methods, also Object, Array, Number and even Function!
var char = 'my string'.charAt(0);
We use these prototype functions every day and the fun thing is that we can create our own. But that’s for the next blogpost.
