93.04%

1時間32分

受付中 javascriptの例外処理について

  • JavaScript

    3652questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

  • 例外処理

    11questions

    例外処理(Exception handling)とは、プログラム実行中に異常が発生した場合、通常フローから外れ、例外として別の処理を行うようにデザインされたプログラミング言語構造です。

2016/02/15 21:50 投稿

lmnwtr2027 score 3

  • 4

    回答

  • 0

    評価

  • 135

    view

前提・実現したいこと

javascriptでリファクタリングした際、例外処理の取り扱いがよくわからなかったので教えて下さい。

ソースコード

以下のように、ボタンを押すとエラーチェックを行い、問題ない場合のみ次の処理を行う処理を書きました。
この時、エラーチェック処理がとても長いため、この部分を関数に切り出そうとしました。

$(".sample").click(function(){
    var isError = true;
    /* 
    長いエラーチェック。エラーの場合、isError=falseをセット。
    */
  if ( isError = false ){
        alert("Error発生");
        return false;
    }
    /* 上のエラーチェックにひっかかない場合のみ行う処理をここに記述 */
})

すると、try~catchでくくる必要があり、余計にソースが分かり辛くなったように感じました。

$(".sample").click(function(){
    try{
        validate();    
       }
    catch(e){
        return false;      
    }
    /* 上のチェックにひっかかない場合に行う処理をここに記述 */
})

function validate(){
    var isError = true;
    /*
    長いエラーチェック。エラーの場合、isError=falseをセット。
    */
    if ( isError = false ){
        alert("エラー発生");
        throw "Error"
    }
}

こういう場合、もっと良い方法はないのでしょうか。
また、これでよい場合throw節には普通何を投げればよいのでしょうか。
曖昧な質問ですみませんが、よろしくお願いします。

情報の追加・修正の依頼をする(0)

※回答は回答欄にご記入下さい。

記入例

  • ・質問の「○○○」の部分をもう少し具体的に書いてください。
  • ・開発環境は何ですか?(OSやバージョン)
  • ・「○○○」の部分に誤字脱字があります。

気になる質問をクリップする

クリップした質問に回答があった場合に通知・メールを受け取ることができます。

クリップした質問はマイページの「クリップ」タブからいつでも見ることができます。

良い質問の評価を上げる

以下のような質問は評価を上げましょう。

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

質問の評価を上げたことを取り消します

0

質問の評価を下げる

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 広告と受け取られるような投稿

評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

評価を下げる理由を選択してください

上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

質問の評価を下げる機能の利用条件

この機能を利用するためには、以下の事項を行う必要があります。

質問の評価を下げたことを取り消します

回答(全4件)

回答の評価を上げる

以下のような回答は評価を上げましょう。

  • 正しい回答
  • わかりやすい回答
  • ためになる回答

評価が高い回答ほどページの上位に表示されます。

2

この機能は開放されていません

評価を下げる条件を満たしてません

提示されているコードだと、try/catch の「大域脱出」の利点を享受できるものになっていませんね。通常の関数呼び出しのフローより大きく脱出できるところが嬉しいわけで、だからこそ異常系の処理に向くわけです(が、異常系処理以外でも使いどころはあります)。

$(".sample").click(function(){
    try{
        validate();    
       }
    catch(e){ // ※ 例外捕捉
        return false;
    }
    /* 上のチェックにひっかかない場合に行う処理をここに記述 */
})

function validate(){
    ...
    if (/* あれのチェック */) throw new Error('あれがおかしい');
    ...
    if (/* これのチェック */) throw new Error('これがおかしい');
    ...
    if (/* それのチェック */) throw new Error('それがおかしい');
    return; // 問題ナッシング
}

ここで validate() が別関数になっているところは重要ではありません。異常を発見したらボンボン例外を投げちゃうことで、正常系の処理を書くことに集中できます。下のコードのほうが本質を理解しやすいかもしれません。

$(".sample").click(function() {
    try{
        doSomething();    
       }
    catch(e){ // ※ 例外捕捉
        return false;
    }
});

function doSomething() {
    ...
    if (/* あれのチェック */) throw new Error('あれがおかしい');
    ...
    if (/* これのチェック */) throw new Error('これがおかしい');
    ...
    if (/* それのチェック */) throw new Error('それがおかしい');
    /* 上のチェックにひっかかない場合に行う処理をここに記述 */
}

validate() や doSomething() の中で例外を投げ分けることで、※印のところで例外の種類による処理の変更なんかもできます。

余談ですが、手続き型言語の多くに提供されている return も、いわゆる構造化プログラミングのフローを飛び越えて脱出できる命令と考えることができます。

$(".sample").click(function() {
    if (! validate()) return false;
    /* 上のチェックにひっかかない場合に行う処理をここに記述 */
});

function validate() {
    ...
    if (/* あれのチェック */) return false;
    ...
    if (/* これのチェック */) return false;
    ...
    if (/* それのチェック */) return false;
    return true; // 問題ナッシング
}


最初のコードとほぼ同じです。違うところは、return は自分のいる関数から脱出することしかできないのに対し、throw では try をしかけたところまで脱出できることです。つまり、validate() が超複雑で、さらに細かい検証関数を呼び出すような作りにした場合でも、その中で例外を投げるだけで簡単に大域脱出できるということです。

2016/02/15 23:22 投稿

unau score 1445

回答の評価を上げる

以下のような回答は評価を上げましょう。

  • 正しい回答
  • わかりやすい回答
  • ためになる回答

評価が高い回答ほどページの上位に表示されます。

0

この機能は開放されていません

評価を下げる条件を満たしてません

validate でスローせずに boolean を返してみてはどうですか?
ちなみに、isError という名前にする場合は true がエラーです。
false をエラーとしたいのであれば、変数名は isValid などにすべきですね。

$(".sample").click(function(){
    if (validate()){
        alert("Error発生");
        return false;
    }
    /* 上のチェックにひっかからない場合に行う処理をここに記述 */
})

function validate(){
    var isError = false;
    /*
     * 長いエラーチェック。エラーの場合、isError = trueをセット。
     */
    return isError;
}

2016/02/15 22:12 投稿

root_jp score 855

回答の評価を上げる

以下のような回答は評価を上げましょう。

  • 正しい回答
  • わかりやすい回答
  • ためになる回答

評価が高い回答ほどページの上位に表示されます。

0

この機能は開放されていません

評価を下げる条件を満たしてません

throw は処理を強制的に停止させたい場合に使いますが、せっかく throw したところを try-catch で例外を止めて処理させる部分に矛盾を感じます。
例外を発生させたいのなら throw new Error で強制終了させれば良いですし、静かにエラーを発生させたい(強制終了したくない)のなら throw を使わないようにしてみてはいかがでしょうか。

'use strict';
function validate (element) {
  element.checkValidity();

  var validity = element.validity,
      error = [];

  if (element.valueMissing) {
    error.push('required');
  }

  if (element.patternMismatch) {
    error.push('pattern');
  }

  return error;
}

function handleClick (event) {
  var error = validate(event.currentTarget.elements['hoge']),
      errorMsg {required: '必須項目です', pattern: '文法エラーです'};

  for (var i = 0, l = error.length; i < l; ++i) {
    console.error(errorMsg[error[i]]);
  }
}
jQuery(('.sample').on('click', handleClick);

Re: lmnwtr2027 さん

2016/02/16 01:01 投稿

think49 JavaScript総合1位

score 2489
  • jQuery総合1位

回答の評価を上げる

以下のような回答は評価を上げましょう。

  • 正しい回答
  • わかりやすい回答
  • ためになる回答

評価が高い回答ほどページの上位に表示されます。

0

この機能は開放されていません

評価を下げる条件を満たしてません

=の比較演算子は=2つまたは3つです。
===の厳密な比較の方でいいと思います。

/* 誤 */
if(isError = false)

/* 正 */
if(isError == false)

if(isError === false)

また、他の方も仰っていますが、初期値をfalseにして、
エラーがあったらtrueにした方が、このように書けます。

var isError = false;

// エラーがあったら
isError = true;

if(isError){ //エラー処理 }

2016/02/16 10:07 投稿

yamato_hikawa score 814

関連した質問

同じタグがついた質問を見る

  • JavaScript

    3652questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

  • 例外処理

    11questions

    例外処理(Exception handling)とは、プログラム実行中に異常が発生した場合、通常フローから外れ、例外として別の処理を行うようにデザインされたプログラミング言語構造です。

関連した質問

ゴールデンウィークを技術力の強化に使おう!
teratail × エキスパート

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る