まず第一に、「グローバル関数を使わない」という配慮、第二には、他のブログパーツ用jsと変数などのネーミングが被らないようにする配慮である。
この二つの配慮を意識したブログパーツjavascriptのサンプルはこのようになる。
blogparts.js
// ブログパーツ(ネームスペース対応)
(function(window, namespace, undefined) {
var mynamespace = window[namespace];
if (!mynamespace) {
mynamespace = {};
window[namespace] = mynamespace;
}
mynamespace.Blogparts = Blogparts;
function Blogparts(obj) {
this.obj = obj;
}
Blogparts.prototype.show = function() {
window.document.write(this.obj.param1);
}
})(this, "jp_hoge_moge"); // 第二引数はネームスペース
このjavascriptを利用者は下のように呼び出す。
blogparts.html
<script type="text/javascript" src="blogparts.js" charset="utf-8"></script>
<script type="text/javascript">
<!--
var bp = new jp_hoge_moge.Blogparts({
param1: "ほげ"
});
bp.show();
//-->
</script>
まず、 new jp_hoge_moge.Blogparts(...) のように、ネームスペース(jp_hoge_moge)を使った呼び出しを行うことで、他の製作者が作った"Blogparts"とカブる可能性を極力排除している。
更に、Blogpartsコンストラクタの引数には、{ param1 : "ほげ" } のような「オブジェクト」を直接渡すことで、グローバル変数の使用を避けている。
ちなみに、ブログパーツ用javascriptの一行目((function(window, namespace, undefined) {)の第三引数 undefined は、"undefined" という変数が外部で勝手に変更されても、ブログパーツのロジックに影響を与えないようにするための繊細な配慮である。こうしておけば、ブログパーツ用javascriptの中で平常通りに undefined が利用できるのだ。
このように、ブログパーツを作るなら、なるべく利用者に優しい仕様を心がけるべきだろう。
今回参考にさせていただいたサイト。
JavaScriptでnamespaceを使おうとして分けがわからなくなった人へ - E v e r G i z m O エヴァー ギズモ
javascript - ブログパーツ/ウィジェット開発者におねがい - 404 Blog Not Found