外部ライブラリを使わないJavaScriptプログラミング

初めまして、入社2日目のsatoです。

現在、JavaScriptで開発といえばprototype.jsやjQueryといったライブラリを使用することが多いですが、ちょっとした開発では直接書いたほうが早い場合もあります。
普段外部のライブラリを使っていると忘れがちになるので、基本的なものをまとめてみました。

・クラスの作成

function Class() {}

Class.prototype.foo = 1;

Class.prototype.hoge = function() {

  this.foo = 2;

}

var c = new Class();

c.hoge();

alert(c.foo); // 2

・XmlHttpRequest

// オブジェクト作成

var xhr = null;

if (window.ActiveXObject) {

  xhr = new ActiveXObject(\"Microsoft.XMLHTTP\");

} else {

  xhr = new XMLHttpRequest();

}

// アクセス

xhr.open(\"GET\", \"foo.xml\", true);

xhr.onreadystatechange = function() {

  if (xhr.readyState == 4) {

    if (xhr.status == 200) {

      var xml = xhr.responseXML;

      // 読み込み完了時の処理を記述する

    }

  }

}

xhr.send(null);

・DOM操作

var elem = document.getElementById(\"foo\"); // #fooの要素を取得

var nodes = elem.childNodes;

for(var i=0;i<nodes.length;i++) {

  // elemの子要素全てに対して何かする

  var node = nodes[i];

  

  // 要素の値を取得する

  // barなら\"bar\"が返る

  alert(node.nodeValue);

}

// 中身を全て取得する場合はinnerHTML

alert(elem.innerHTML);
elem.appendChild(document.createElement(\"br\")); // 
タグを追加

外部ライブラリを使うか使わないかは、規模と書きやすさで考えればいいと思います。書きやすさだけで考えれば何らかのライブラリを使用したほうがいいのですが、巨大なものが多いので（今時そんなの気にしないかもしれませんが）、こういうのも覚えておくと便利です。
かと言って、全部直接書いていくのも面倒なので、例えばprototype.jsのような

function $(e) { return document.getElementById(e); }

ただしそのまま書いていくと、外部ライブラリを使用するのに比べコード量は増えると思いますので、規模が大きくなりそうだと思ったら使い慣れたライブラリに切り替えるのをお勧めします。