0

私はこのJSファイルを持っています

function APIAccess(){
    this.LoadScreen = function(){
        var loadScreen = $('#loadScreen');
        if(loadScreen.html() == undefined){
            loadScreen = '<div id="loadScreen" style="display: none;width: 100%; height: 100%; top: 0pt;left: 0pt;">' + 
                             '<div id="loadScr" style="filter: alpha(opacity = 65);  z-index: 9999;border: medium none; margin: 0pt; padding: 0pt; width: 100%; height: 100%; top: 0pt;left: 0pt; background-color: rgb(0, 0, 0); opacity: 0.2; cursor: wait; position: fixed;"></div>' +
                             '<div id="loader"  style="z-index: 10000; position: fixed; padding: 0px; margin: 0px;width: 30%; top: 40%; left: 35%; text-align: center;cursor: wait; ">' +
                             '<img src="img/ajax-loader.gif" alt="loading" /></div></div>';
            $(document.body).append(loadScreen);
        }
    };

    this.APICall = function(url, params, method, callback){
        this.LoadScreen();  
        var postData = null;
        if(params != null){
            postData = JSON.stringify(params);
        }   
        if(url.toLowerCase().indexOf("http") < 0){
            url = "http://" + url;
        }   
        $('#loadScreen').show(function(){
            $.ajax({
              url: url,
              async: true,
              type: method,
              data: postData,
              success: function(data){
                $('#loadScreen').hide();
                callback(data);
              },
              error:function(data){
                  alert("failure");
                  return false;
              }   
            }); 
        });
    };
}

function Domain(reqCallback){
    this.url = 'http://beta.test123.net/api/domain';
    this.params = null;
    this.method = 'GET';
    this.callback = function(data){
        setCookie("domain", data);
        if(typeof reqCallback != null){
            reqCallback(data);
        }
    };
    this.request = this.APICall(this.url, this.params, this.method, this.callback);
}
Domain.prototype = new APIAccess;

function Login(usermail, pass, reqCallback){
    var domainUrl = getCookie("domain");
    if(domainUrl == null)
        return false;
    else
        domainUrl += '/api/login';

    this.url = domainUrl;
    this.params = {"email": usermail, "password": password};
    this.method = 'POST';
    this.callback = function(data){
        setCookie("login", data);
        if(typeof reqCallback != null){
            reqCallback(data);
        }
    };
    this.request = this.APICall(this.url, this.params, this.method, this.callback);
}
Login.prototype = new APIAccess;

表示される場合は、メソッドthis.request = this.APICall(this.url, this.params, this.method, this.callback);が毎回繰り返されます。APIAccess関数に配置できればいいのにと思います。できることを提案してください。

これをhtmlでこれとして使用します

$(document).ready(function(){
            var domain = new Domain(function(data){
                alert(data);
            });
            domain.request;
        });
4

2 に答える 2

1

これがあなたが求めているものかどうかはわかりません. 以下のコードの最も重要な部分は、オブジェクトプロトタイプの代わりに Object.create() を使用して、基本クラスから「継承」したことです.なぜ？https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/createにアクセスしてください

それが役に立てば幸い ：）

//Base class
var APIAccess = {

    LoadScreen : function () {
        var loadScreen = $('#loadScreen');
        if (loadScreen.html() == undefined) {
            loadScreen = '<div id="loadScreen" style="display: none;width: 100%; height: 100%; top: 0pt;left: 0pt;">' +
                             '<div id="loadScr" style="filter: alpha(opacity = 65);  z-index: 9999;border: medium none; margin: 0pt; padding: 0pt; width: 100%; height: 100%; top: 0pt;left: 0pt; background-color: rgb(0, 0, 0); opacity: 0.2; cursor: wait; position: fixed;"></div>' +
                             '<div id="loader"  style="z-index: 10000; position: fixed; padding: 0px; margin: 0px;width: 30%; top: 40%; left: 35%; text-align: center;cursor: wait; ">' +
                             '<img src="img/ajax-loader.gif" alt="loading" /></div></div>';
            $(document.body).append(loadScreen);
        }
    },

    APICall : function (url, params, method, callback) {
        this.LoadScreen();
        var postData = null;
        if (params != null) {
            postData = JSON.stringify(params);
        }
        if (url.toLowerCase().indexOf("http") < 0) {
            url = "http://" + url;
        }
        $('#loadScreen').show(function () {
            $.ajax({
                url: url,
                async: true,
                type: method,
                data: postData,
                success: function (data) {
                    $('#loadScreen').hide();
                    callback(data);
                },
                error: function (data) {
                    alert("failure");
                    return false;
                }
            });
        });
    },

    //added to base class
    url : null,
    params : null,
    method : null,
    callback : null,
    request : function(){
        //TODO validate url, params and method here
        APICall(this.url, this.params, this.method, this.callback);
    }
}


var Domain = function(reqCallback) {
    var obj = Object.create(APIAccess);
    //obj.prototype = APIAccess;
    obj.url = 'http://beta.test123.net/api/domain';
    obj.params = null;
    obj.method = 'GET';
    obj.callback = function (data) {
        setCookie("domain", data);
        if (typeof reqCallback != null) {
            reqCallback(data);
        }
    };
    return obj;
}

var Login = function (usermail, password, reqCallback) {
    var domainUrl = getCookie("domain");
    if (domainUrl == null){
        return false;
    }
    else{
        domainUrl += '/api/login';
    }

    var obj = Object.create(APIAccess);
    //obj.prototype = APIAccess;
    obj.url = domainUrl;
    obj.params = { "email": usermail, "password": password };
    obj.method = 'POST';
    obj.callback = function (data) {
        setCookie("login", data);
        if (typeof reqCallback != null) {
            reqCallback(data);
       }
    }
    return obj;
}


//Code below is just for testing
function getCookie(str){
    return 'test';
}

console.log(
    new Domain(function(data){alert(data);}), //domain
    new Login( //loging
        'user',
        'passwd',
        function(data){alert(data);}
    )
)
于 2013-05-14T14:38:31.790 に答える
1

OweRReLoaDeD の答えは正しいですが、より簡潔に言えば:

継承を設定するためだけに基本クラスをインスタンス化しないでください。

Domain.prototype = new APIAccess;

する必要があります

Domain.prototype = Object.create(APIAccess);

そうは言っても、あなたがモデリングしているものは継承で少し奇妙に見えます。別の方法を提案する時間があればいいのにと思います。

于 2013-05-14T14:41:54.167 に答える