このページの本文へ

JavaScriptで始めるQuartz Composer入門 (3/4)

2009年09月24日 10時00分更新

文●古籏一浩

  • この記事をはてなブックマークに追加
本文印刷

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上で変更した内容がリアルタイムで反映されます。

この連載の記事

一覧へ
Web Professionalトップページバナー

この記事の編集者は以下の記事をオススメしています

Webディレクター江口明日香が行く