第23回 「関数(5)」
前回は個別に色を指定してメッセージを表示する処理について説明しました。今回はカラー名などが指定されていない場合（エラー処理）について説明します。（前回は下記プログラム）
<html>
<head>
<title></title>
</head>
<body>
<script language="JavaScript"><!--
function printMsg(msgAry, col)
{
n = Math.floor(Math.random() * msgAry.length);
document.write("<font color='"+col+"'>");
document.write(msgAry[n],"<br>");
document.write("</font>");
}
msg = [ "こんにちは",
"いい天気",
"みたいですね",
"おしまい",
"やっぱり再開？" ];
printMsg(msg,"red");
// --></script>
<hr>
■今日のことわざ<br>
<script language="JavaScript"><!--
kotowaza = [ "雨降って地固まる",
"人を見たら泥棒と思え",
"ただより高いものはない" ];
printMsg(kotowaza,"blue");
// --></script>
<hr>
</body>
</html>
カラー名／カラーコードが指定されていない、つまり関数printMsgの引数colに何もないということです。関数内に
alert(col);
の命令を追加して引数colの内容を調べてみるとカラーコードが渡されていない場合、
printMsg(msg);
のように呼び出された場合には以下の文字が表示されます。
undefined
これは「未定義」である、つまり何も定義されていませんよ、という事です。それならば引数の内容がundefinedだったら黄色にするには以下のようにすれば良さそうです。
if (col == undefined) col = "yellow";
しかし、これを実行するとエラーになってしまいます。というのもundefinedという予約語がないため変数とみなされエラーになってしまいます。このような場合には「typeof」という命令を使って変数colの種類が何なのかを文字列に変換する必要があります。つまり
if (typeof(col) == "undefined") col = "yellow";
のように書かなければいけません。typeofは現在の値／変数が何なのかを示す文字列を返します。文字列だったら"string"、数値だったら"number"のようになります。
こりゃ面倒だ、という人向けに以下のように否定演算子である「！」を使って書くこともできます。
if (!col ) col = "yellow";
colが何もないの否定なので何もない場合にはif()の条件は「真」になります。colに色名が入っていれば条件は「偽」となり以後の命令は実行されません。
実際のプログラムは以下のようになります。（否定演算子を使ったサンプル）
<html>
<head>
<title></title>
</head>
<body>
<script language="JavaScript"><!--
function printMsg(msgAry, col)
{
if (!col ) col = "yellow";
n = Math.floor(Math.random() * msgAry.length);
document.write("<font color='"+col+"'>");
document.write(msgAry[n],"<br>");
document.write("</font>");
}
msg = [ "こんにちは",
"いい天気",
"みたいですね",
"おしまい",
"やっぱり再開？" ];
printMsg(msg);
// --></script>
<hr>
■今日のことわざ<br>
<script language="JavaScript"><!--
kotowaza = [ "雨降って地固まる",
"人を見たら泥棒と思え",
"ただより高いものはない" ];
printMsg(kotowaza,"blue");
// --></script>
<hr>
</body>
</html>
とりあえず、これで色指定を忘れてしまった場合でも動くようになりました。次回は、この関数を別ファイルとして保存し、他のファイルからも再利用できるようにしてみます。