Quartz ComposerのJavaScriptでは型の宣言が必須
JavaScriptの便利な点は、変数の型(種類)を気にせずに使えることです。変数の型とは「この変数は数値しか扱えません」「文字列しかダメです」といった制限のことですが、JavaScriptの場合、型が違っていても気を利かせて自動的に変換してくれるので、数値でも文字列でも配列でも特に意識せずに代入したり、型が異なる変数を連結したりできます。
しかし、Quartz Composerの場合はこれでは困ります。というのも、Quartz Composerの部品には「数値のみ」「文字列のみ」「色情報のみ」といった、受け付けるデータに制約があるためです。そこでQuartz ComposerでJavaScriptを使う際には必ず「変数の型」を宣言し、入力側の変数と出力側の変数に設定します。型は以下の7つが用意されています。
- __boolean
- 真偽値
- __index 整数
- (小数値NG)
- __number
- 実数(小数値OK)
- __string
- 文字列
- __image
- 画像
- __structure
- 構造体(JavaScriptの場合はハッシュ/連想配列/配列)
- __virtual
- 不定
先ほど配置した部品のサンプルコードには以下のように書かれていました。
function (__number outputNumber) main (__number inputNumber[2])
functionの直後の()内が出力側、main()の中にあるのが入力側のパラメータです。入力/出力するデータが複数ある場合は,(カンマ)で区切って列記し、その場合も個別に変数の型を指定します。また、inputNumber[2]とすると「inputNumber」という名前の配列になります。
これで入力側と出力側の設定が分かりました。さらにサンプルコードの続きを見てみましょう。サンプルは以下のように、入力された2つの値を加算した結果を出力するようになっています。
var result = new Object();
result.outputNumber = inputNumber[0] + inputNumber[1];
return result;
Quartz Composerでは出力結果をオブジェクトで返す必要があります。オブジェクト名は問いませんが、オブジェクトに使用されるプロパティ名には決まりがあります。オブジェクトのプロパティ名は、function〜で設定した出力名と一致していなければなりません(*1)。サンプルでは出力名は「outputNumber」になっていますから、「オブジェクト名.outputNumber」に出力したいデータを入れる必要があります。また、この時、データの型がfunction〜で指定した型と一致していないと即時エラーになります(*2)。
*1 function〜で設定した変数名が部品の入力側と出力側に反映されます。なるべく分かりやすい名前を付けておくとよいでしょう。ただし、日本語は使用できません。
*2 一般的なJavaScript開発では、スクリプトを記述したあと、Webブラウザー上でリロードするなどの手続きが必要ですが、Quartz ComposerではEditor上で変更した内容がリアルタイムで反映されます。