というのも、プログラミングするときに便利に使うには、JavaScriptライブラリやフレームワークで実践されているノウハウを使うと、非常に楽になるのではないかと思う。

例えば、JavaScriptの基本は「プロトタイプでオブジェクトをカスタマイズする」というところが、すでに実装されたオブジェクトにも通用するので、どんどん便利にできる。

Mootoolsを参考に、いくつか便利な関数を作ってみた。

function $(id) {
 return document.getElementById(id);
}
String.prototype.contains = function(string, separator) {
 return (separator) ? (separator + this + separator).indexOf(separator + string + separator) > -1 : this.indexOf(string) > -1;
}
String.prototype.trim = function() {
 return this.replace(/^\s+|\s+$/g, '');
}
String.prototype.clean = function() {
 return this.replace(/\s+/g, ' ').trim();
}
Element.prototype.hasClass = function(className) {
 return this.className.clean().contains(className, ' ');
}
Element.prototype.addClass = function(className) {
 if (!this.hasClass(className)) this.className = (this.className + ' ' + className).clean();
 return this;
}
Element.prototype.removeClass = function(className) {
 this.className = this.className.replace(new RegExp('(^|\\s)' + className + '(?:\\s|$)'), '$1');
 return this;
}
Element.prototype.setStyle = function(property, value) {
 this.style[property] = value;
 return this;
}
Element.prototype.setStyles = function(styles) {
 for (var style in styles) this.setStyle(style, styles[style]);
 return this;
}

動きますかね？　ざっと作っただけなので、ノーテストなんですが、、、

でもまぁ言いたいことは伝わってると思います。上記のElementやStringはJavaScriptのNativeオブジェクトでprototypeで機能拡張して、同じオブジェクトすべてで同じ機能が使えるようになります。

だから、以下のように使うことができるんです。

$('test').addClass('test-class');
$('test').removeClass('test-class');
$('test').setStyles({'width': '100px', 'height': '100px'});

ちなみに、Mootoolsではimplementというメソッドが用意されていて、

String.proototype[methodName] = functionObject;

というように、実装するようになっているみたいです。つまりこれは、

String.proototype.methodName = functionObject;

としているのと同じなんですね。