Augmentation is one of my favorite features of JavaScript. Being able to, at any point, add static and instance methods to new and existing types is a wonderful feature of this dynamic language. In this post, I’ll describe two common ways of augmenting JavaScript types and how those ways can be made safer while adhering to the DRY principle.
Instance Methods
One of the most common uses of augmentation is adding instance methods to types. Using a type’s prototype chain, methods can be added to all new and existing instances of the augmented type:
Array.prototype.indexOf = function (item) {
};
In this code snippet, the “indexOf
” function was added to the prototype of the Array
object. Each Array
instance will have this method (even if the instance was created before the method was defined). This method will also replace any previous implementations of the “indexOf
” function. It is best to make sure the function doesn’t already exist:
if (typeof Array.prototype.indexOf === "undefined") {
Array.prototype.indexOf = function (item) {
};
}
Here the typeof
operator is used to determine whether the method is undefined. If it is, the method implementation is added to the Array
object.
Static Methods
Functions can also be added as static
methods of a given type:
String.Format = function (format) {
};
In the code snippet above, the “Format
” method was added as a static
method of the String
object. Similar to adding instance methods, it is best to make sure this method does not already exist:
if (typeof String.Format === "undefined") {
String.Format = function (format) {
};
}
Don’t Repeat Yourself
If your augmentation code is augmenting multiple types or with multiple methods, the type check will be used over and over. Why not make that part of the code reusable? By using augmentation, a reusable method can be implemented to perform this type check and the augmentation:
if (typeof Function.safeAugment === "undefined") {
Function.safeAugment = function (obj, func, impl) {
var method = obj[func];
if (typeof method === "undefined") {
obj[func] = impl;
}
};
}
Here the augmentation code is wrapped inside the “safeAugment
” function. This function is implemented as a static
method of the “Function
” object. The “safeAugment
” function takes three parameters: the object to augment, the function name to add to the object, and the implementation of the function. Here is an example of its use:
Function.safeAugment(Array.prototype, "indexOf", function (item) {
});
The safeAugment
function is used to define our indexOf
instance method for the Array
object. The safeAugment
function can be used to defined static
methods as well:
Function.safeAugment(String, "Format", function (item) {
});
Here, the “Format
” method is added to the String
object as a static
method.
Enhancing the Augmentation Code
As it stands now, the safeAugment
function performs its duty: augment the given object with the given method with the given implementation. The first and most obvious improvement would be to validate its parameters. This means making sure that each parameter is of an expected type so the object to augment exists, the function name is a string
(and not null
), and the implementation is a function. Improvements beyond this are more dependent on your given circumstances. Perhaps you want to allow the implementation to be null
, or add logging capabilities, or locate the point in which all the elements in the multiverse will collide, etc. The point is to safely augment JavaScript types while adhering to the DRY principle.
CodeProject
Filed under: JavaScript, Strategist
Tagged: Augmentation, DRY