Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

jQueryのajaxで通信するまでもない場合に使えるテクニック

More than 5 years have passed since last update.

解決したい課題

例えば以下のようなケースを考える。

sample.js
//~ ~ ~ app logic ~ ~ ~

getInfo('hoge').done(function(response) {
    alert('OK!');
}).fail(function(response) {
    alert('NG!');   
});
sdk.js
function getInfo(request) {
    return $.ajax({
        type : 'GET',
        url : 'http://foo.bar/' + request,
    });
}

WebAPIをWrapするSDKを開発するとして、ajaxの実行部分の実装を切り出して、ajaxの戻り値をそのまま返すような関数を実装したとする。

上記のsample.jsの挙動としては、sdk.jsの関数を呼び出してajax通信が成功したらdone、失敗したらfailが呼ばれる。

ここで、getInfoに渡すパラメータが通信するまでもなく不正な場合、通信コストを減らすために通信する前にエラーを返す、つまりfailを呼んであげたいところ。

SDKの実装を少し工夫する

ではajaxの実行前にパラメータチェックを入れ、アプリ側でdonefailをちゃんとハンドルできるように変更してみる。

sdk.js
function getInfo(request) {
    if (!isValid(request)) {
        return {
            done : function() {
                return this;
            },
            fail : function(callback) {
                callback({message : 'invalid parameter'});
                return this;
            }
        };
    }

    return $.ajax({
        type : 'GET',
        url : 'http://foo.bar/' + request,
    });
}

function isValid(param) {
    // ~ 略 ~
}

こんな感じに、パラメータ不正の場合はgetInfoの戻り値でdoneとfailのプロパティを持ったオブジェクトを返してやれば良い。

注意点としては、ちゃんとdoneも返してあげないと、アプリ側がfailよりも先にdoneを実装した場合にfailが呼ばれなくなってしまう点。doneは何もせずにthisを返せばOK。

ryoheimorimoto
Qiitaへの投稿内容は個人の見解であり、所属する団体の意見を代表するものではございません。
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away