今回はプログラムの醍醐味である「条件分岐」を学びます。
“もし○だったら▲の処理、○でなければ■の処理”と、条件に合わせて処理を変えることで、プログラミングの楽しさ、奥深さに触れていきます。
if文
JavaScriptではif文を覚えると、できることが一気に広がります。エクスプレッションでは、「ソーステキストがあれば、そのまま表示、なければデフォルトの文言を表示」。スクリプトでは「テキストレイヤーを選択していれば処理続行、選択レイヤーにテキストレイヤーがなければ処理を停止」など、プログラムの分岐や、エラーの巻き取りまでアイディア次第であらゆることが実現できます。
書き方
if( 条件を比較するための式 ){
条件が「真(true)」の場合の処理
} else {
条件が「偽(false)」の場合の処理
}条件の式に合っている場合を「真(true)」、条件に合っていない場合を「偽(false)」と呼びます。
例えば「不透明度のレイヤー」に
if(position[0]<500){;
opacity=0;
} else {
opacity=100;
}というエクスプレッションを記述すると、このレイヤーは左端から右に500px未満では、見えなくなります。
条件の比較方法
if文の条件の比較方法は下記の通りです。
| 比較演算子 | 意味 |
| == | 左辺と右辺が同じ |
| != | 左辺と右辺が違う |
| < | 左辺が右辺未満 |
| > | 右辺が左辺未満 |
| <= | 右辺が左辺以上 |
| >= | 左辺が右辺以上 |
| === | 左辺と右辺が値も型も同じ |
このように左辺と右辺を比較演算子で繋ぎ、正しければtrue、異なればfalseとなる処理を分けるトリガーが簡単に作れます。
複数の条件1
var point=30;
if(point>95){
alert("合格です！");
}else{
if(point>80){
alert("もう少し");
}else{
alert("不合格！");
}
}
if文を入れ子にすれば、条件を増やせます。
ただし多少煩雑になるため、次のif文があります。
複数の条件2
「else if文」
var point=30;
if(point>95){
alert("合格です！");
}else if(point>80){
alert("もう少し");
}else{
alert("不合格！");
}
elseとifをひとまとめにした「else if」という記述があります。「else if」を繰り返すことで、何通りもの条件を追加しやすくなります。
複数の条件3
論理演算子
| 論理演算子 | 意味 |
| AND && | if(条件1 && 条件2){ 条件1「かつ」条件2がtrueであれば |
| OR || | if(条件1 || 条件2){ 条件1「もしくは」条件2がtrueであれば |
| NOT ! | if(!条件){ 条件がfalseであれば if(条件1 != 条件2){ 左辺と右辺が異なれば |
if文で効率化を広げる
条件での分岐を行うことで、様々な処理を自動化できます。プログラムの可能性を一気に広げる知識ですので、if文を使いこなして、想像を上回る効率化を見つけていきましょう。
次回予告
次回はJavaScript内で意味を持ってしまう文字「”」や、使う機会が多い「改行」などはどう指定すればいいのか、特殊文字について学んでいきます。
下記リンクから飛べます。
この記事へのコメントはありません。