CreateJS Suiteのクラスに、名前空間が定められることになりました。今のところ、EaselJS 0.4.2や各ライブラリの圧縮版(tweenjs-0.2.0.min.jsなど)には名前空間が設定されていません。しかし、今後のバージョンから追加される予定です。その内容と対応の仕方についてご説明します。

01 名前空間をなぜ使うのか

「名前空間」(namespace)は、数多くの名前(識別子)があるとき、それらを分類してまとめた集合です。プログラミングでは、その集合に名前(識別子)をつけて扱います。CreateJS Suiteのクラスには、今後デフォルトでcreatejsという識別子が名前空間としてつけられます。すると、たとえばShapeクラスのコンストラクタでインスタンスをつくるとき、つぎのように名前空間createjsをつけて呼出すことになります。

new createjs.Shape()

これは、一見煩わしく感じられるでしょう。けれど、数多くのライブラリを使うと、別のライブラリに同じ名前のクラス(Shape)が定められているかもしれません。名前空間をつけることにより、このような名前の重複が防げるのです。

また、名前空間をグローバルな変数に代入すれば、参照は変えられます。つまり、その変数名を新たな名前空間として使えるのです。

var c = createjs;   // 名前空間createsを変数に代入 var myShape = new c.Shape();

02 名前空間を省くには

もっとも、ライブラリはCreateJS Suiteしか使っていないとか、他のライブラリを用いていても名前の重複がないとわかっている場合もあるでしょう。そういうとき、名前空間が省けると便利です。それだけでなく、これまで名前空間のないCreateJSでつくったスクリプトが、新しいバージョンのクラス(JSファイル)に置換えると動かなくなってしまうのは問題です。

そういうときには、CreateJS Suiteライブラリをscript要素で読込む前に、名前空間(createjs)をWindowオブジェクトに設定してしまう手があります。すると、名前空間に初期化されたクラスはWindowオブジェクトにも納められるので、名前空間を省いても参照できます。

<script>
var createjs = window;
</script>
<script src=CreateJS Suiteのライブラリ></script>

これでCreateJS Suiteクラスのバージョンが新しくなっても、これまでどおり名前空間(createjs)なしに参照できるようになります。ただしそのときは、改めて名前の重複に注意しなければなりません。

new Shape()
new this.Shape()

03 名前空間の実装

本稿執筆時点で、TweenJS 0.2.0が遷移によっては、クラスに名前空間(createjs)の定められたJavaScriptファイルがダウンロードされるようです。圧縮版(tweenjs-0.2.0.min.js)にはまだ名前空間がありませんので、script要素で個別のクラスを読込むように書替えるとスクリプトが動かなくなるという問題が生じ得ます。

名前空間を定めたTweenクラスは、つぎのように実装されています。なお、入れ子関数によるクラスの定義については、「JavaScriptでオブジェクトに設定した関数のスコープ」04「クラスを入れ子関数として定義する」をご参照ください。

(function(ns) { var Tween = function(target, props) {   this.initialize(target, props); } var p = Tween.prototype; // ...[中略]... ns.Tween = Tween;   // クラスを名前空間に設定 }(createjs || (createjs = {}))); var createjs;

作成者: 野中文雄
更新日: 2012年7月29日「JavaScriptでオブジェクトに設定した関数のスコープ」への参照を追加。
作成日: 2012年7月22日