前回の記事「2つのレイヤー間に均等配置させるエクスプレッション」にて、実際にエクスプレッションに触れました。

今回は「JavaScriptを読みやすくする注釈を付ける方法」の記事です。

コメントアウト

数行程度のプログラムならもう一度見た際に内容を把握するのは容易いですが、今後ご紹介する変数や関数、また処理を繰り返すfor文や、処理を分けるif文はすぐに使うようになりますが、一つの「スコープ」と呼ばれるカゴの中の処理を使うようになるとすぐに、読みやすいように改行、改行で1行は短いまでも、何十行にも及ぶプログラムになることもザラです。

JavaScriptでは計算に関係のない「コメント」を記述することが出来ます。これを「コメントアウト」と言って、「プログラムから無効化(アウト)したテキスト」という意味です。注釈に使います。

実際のコメント

実際のコメントが下記です。

r=thisComp.layer("root"); // ルートレイヤー
/*
複数行のコメントも
書けます。
*/

このように「//」で区切った後はその行の内に限りコメントとなります。

通常であれば、プログラム内で指定のない文字を使うとエラーが出ますが、「// ルートレイヤー」はコメントなので、プログラムとして実行されず、エラーが出ません。

複数行のコメントを書きたい場合は「/*」で開始し、「*/」で閉じます。「/*」以降は「*/」が記述されるまで全てコメントとなりますので、必ず閉じてください。

また、エラーが起こっていそうな行をコメントアウトしてデバッグすることにも利用できます。

r=thisComp.layer("root");
// g=thisComp.layer("gol");
// ↑"gol"レイヤーがない？名前間違い？

プログラム管理にはコメントアウト

WEBサイトも「HTML」や「PHP」というプログラムで記述されています。

好きなサイトのソースを見てみてください。サイト上で右クリック→「ページのソースを表示」です。プログラマーが管理しやすいように「ここからはヘッダーの設定」といったコメントを”<!– header setting –>”などとコメントアウトしているのが確認できるかと思います(HTMLのコメントアウトは「<!–」と「–>」で挟みます)。

コメントアウトでわかりづらいプログラム言語に注釈を加えて、より管理しやすい作り方を心がけると修正の際に助かりますね。

次はAfter Effectsに初めから組み込まれているエクスプレッションを使ってみます。そうした機能を「関数(function)」と言い、自分で作ることもできるのですが、初めの内はAfter Effects組み込みのエクスプレッションを覚えていきながら、それらを組み合わせたり、ネット上にある先駆者が作った関数を見習いつつ、エクスプレッションに触れて勉強していくのがいいと思います。

次回予告

次回はいよいよ効率的に記述していきましょう。

前回触れた「変数」。「=」を使って自分で独自の「変数」というものを設定し、プログラムを短くしていきましょう。

次回はこの変数を活かして文法の整頓をしてみます。

下記リンクから飛べます。

「変数」でJavaScriptを効率化