Top > HP作成> 隠居のお勉強:JavaScript(11) try...catch

2008年4月28日

隠居のお勉強:JavaScript(11) try...catch

 サンデー毎日なのに結構なにやかやと時間をとられて、お勉強がすすんでいない。例によって、W3Schools の tutorial にしたがって、次のステップに進もうと思う。

 ネットでいろいろと調べてみると、try... catch という構文は、Ajaxでほぼ必須になっているらしい。私のJavaScript の勉強は、Web ページをもう少し動的にしたいという、だいそれた願望に基づいているから、Ajax に必須なら、特に力を入れて勉強したいと思う。

 try...catch の構文の文法は、次のように解釈できる。
try{エラーをキャッチしたいcodeの実行}
catch(err){エラーをキャッチしたときの処理内容}


 Script を書いていて、プログラムにバグがないかどうかを確認するときなどに使うらしい。エラーの内容を表示するようにしておくと、バグの箇所と特定するのに役に立つということである。本格的に JavaScript プログラムを書くことはまだまだ先のことであろうが、おぼえておきたい。

 W3Schools には、例示として次のようなコードが示されている。
<html>
<head>
<script type="text/javascript">
var txt=""
function message()
{
try
  {
  adddlert("Welcome guest!");
  }
catch(err)
  {
  txt="There was an error on this page.\n\n";
  txt+="Click OK to continue viewing this page,\n";
  txt+="or Cancel to return to the home page.\n\n";
  if(!confirm(txt))
    {
    document.location.href="http://www.w3schools.com/";
    }
  }
}
</script>
</head>

<body> <input type="button" value="View message" onclick="message()" /> </body>
</html>

 try ブロック部分の adddlert("Welcome guest!"); の adddlert は alert のミススペルでエラーとなるから、catch ブロックの処理を行って、confirm-box を表示させることになる。

 あまり意味はないが、テストのために上のコードを少しいじって、このエントリーに取り込んでみた。下のボタンをクリックしてみてください。 Confirm Box が出るはずです。

    
 なお、この JavaScript 部分を外部ファイル化し、テンプレートの head 部分に読み込んで使うことを試したがうまくいかなかったので、直接 head 部分に書き込んでいる。

トラックバックURL

このエントリーのトラックバックURL:
http://n-shuhei.net/cgi/mt/mt-tb.cgi/1457

コメントする

(初めてのコメントの時は、コメントが表示されるためにこのブログのオーナーの承認が必要になることがあります。承認されるまでコメントは表示されませんのでしばらくお待ちください)
 MovableType または TypeKey のサインインができない方には、「匿名でコメントする」をクリックください。スパム・コメントを防止するためにコメント入力欄の下のCaptcha:画像で表示されている文字入力をお願いしています。
 できれば、MovableType または TypeKey の登録をしていただければ、Captcha:画像で表示されている文字入力の必要はありません。
MovableType のアカウントの取得は、下のサインインの文字をクリックするとでる画面で「サインイン画面のアカウントがないときはサインアップしてください。」のサインアップをクリックすれば登録画面が表示されます。「ウェブサイトURL」には、http://n-shuhei.net/atelier/ と入力ください。
 また、TypeKey は、 TypeKey サインインをクリックし新規登録ボタンから無料で取得できます。取得された TypeKey で他の多くのブログにコメントができます。)