Javascriptクラス - プロパティを設定できません

Question

JavaScriptを使用してクラスを作成するには、以下のコードを使用しています....今度は 'website'のIDを渡してから、ajax呼び出しで残りのデータベースからの情報（JSON ENCODED）。

私の唯一の問題は、最後のオブジェクトのwhatsがそのIDだけを表示していることです。

成功した後this.address（ajax）に結果を表示すると、ajax呼び出しが正常に機能します。

私は、私はajaxリクエストでプロパティを設定することはできません...助けることができますか？

function website(id) { 
    this.id = id; //id 


    $.ajax({ //website_information 
     type: "GET", 
     url: '/proc.php?proc=website_name&id=' + this.id + '', 
     success: function(data){ 
     var tmp = $.parseJSON(data); 
    this.address = tmp.website_address; 

    this.name = tmp.website_name; 
     } 
    }); 

    } 

    var obj = new website('20'); 
    obj.alertwebsite(); 
    console.log(obj); 

Answer 1

ここには2つの問題があります。 1つは、$.ajaxが非同期であることです。つまり、が返され、要求が完了したのはです。 success関数は、要求が完了したときに実行されますが、前にobj.alertwebsite()が実行されます。

2番目の問題は、AJAXコールバック内のthisの値です。コールバック内で、thisは、AJAX呼び出しのすべての設定を含むオブジェクトに設定されます。つまり、このオブジェクトに対してaddressとnameのプロパティを設定しています。これには2つの方法があります。最初はthat = thisで、他の回答と同じです。よりよい方法は、AJAX呼び出しでcontext設定を使用することです。これはあなたがthisは、コールバックの内側に何を意味するかをカスタマイズすることができます

function website(id) { 
    this.id = id; //id 

    $.ajax({ //website_information 
     type: "GET", 
     url: '/proc.php?proc=website_name&id=' + this.id + '', 
     context: this, 
     success: function (data) { 
      var tmp = $.parseJSON(data); 
      this.address = tmp.website_address; 

      this.name = tmp.website_name; 
     } 
    }); 
} 

。これはthe jQuery AJAX documentationに記載されています。

Answer 2

function website(id) { 
    // you need to save "this" 
    var self = this; 
    this.id = id; //id 


    $.ajax({ //website_information 
     type: "GET", 
     url: '/proc.php?proc=website_name&id=' + this.id + '', 
     //async: false, // optionally, if you want to get it back syncronously, so the console.log after the function call will already have the data 
     success: function(data){ 
     var tmp = $.parseJSON(data); 
    // you need to use the saved "this" 
    self.address = tmp.website_address; 

    self.name = tmp.website_name; 
     } 
    }); 
} 

Answer 3

AJAXコールバックの内側thisは、「オブジェクトツーなる」あなたのコンストラクタを作っていることに言及することはできません。代わりに、thatのように別の変数に入れて外部からthisを保存します。次に、thatを使用して、AJAXコールバックのオブジェクトを参照します。

function website(id) { 
    var that = this; //preserve "this" 
    this.id = id; 
    $.ajax({ 
     type: "GET", 
     url: '/proc.php?proc=website_name&id=' + this.id + '', 
     success: function(data){ 
      var tmp = $.parseJSON(data); 
      that.address = tmp.website_address; //using "that" 
      that.name = tmp.website_name;  //using "that" 
     } 
    }); 
} 

あなたのウェブサイトの情報（that.addressとthat.name）がロードされされているかどうかがわからないので、また、あなたはあなたのobj.alertwebsite()に盲目的に呼びかけています。