JS戻り関数がありません

Question

次のコードがあります。機能printListものの

var handleJson = function(){ 
     var jsonData ='xx'; 
     var eventObject,eventObjectx=[]; 
     that = this; 
     var convertJsonToObject = function(datax){ 
       //debugger; 
       try { 
         that.printList(datax.data); 
        } catch(e) { 
         console.log(e); 
        } 

       //debugger; 
      } 

     return{ 

      getDatafromserver: function(url){ 

        $.ajax({ 
         crossOrigin: true, 
         url: url, 
         success:convertJsonToObject 
          //console.log(jsonData); 
        }); 

      }, 

      printList:function(eventObject){ 

       $.each(eventObject,function(index,val){ 

        $('#eventlist').append('<li>'+val.event+'</li>'); 
       }) 
      } 

     } 
    } 


    var jsonHandler = new handleJson(); 

     jsonHandler.getDatafromserver(url); 

     //jsonHandler.printList('eventlist'); 


}); 

いずれかが私を助けることができる

TypeError: that.printList is not a function {stack: (...), message: "that.printList is not a function"}

その返すエラーが存在しますか？

Answer 1

that = this行のthisという値は、handleJson関数の最後に返されるオブジェクトにはまったく関係しません。

あなたはhandleJsonとnewを使用しているので、あなたはかなり新しい、無関係なオブジェクトを返すよりも、thisが参照するオブジェクトに追加する：

：

var handleJson = function() { 
    var jsonData = 'xx'; 
    var eventObject, eventObjectx = []; 
    var that = this; 
    var convertJsonToObject = function(datax) { 
     //debugger; 
     try { 
      that.printList(datax.data); 
     } catch (e) { 
      console.log(e); 
     } 

     //debugger; 
    } 

    this.getDatafromserver = function(url) { 

     $.ajax({ 
      crossOrigin: true, 
      url: url, 
      success: convertJsonToObject 
       //console.log(jsonData); 
     }); 

    }; 

    this.printList = function(eventObject) { 

     $.each(eventObject, function(index, val) { 

      $('#eventlist').append('<li>' + val.event + '</li>'); 
     }) 
    }; 

}; 

var jsonHandler = new handleJson(); 

jsonHandler.getDatafromserver(url); 

//jsonHandler.printList('eventlist'); 

ここではどのようnew作品です

• これは、ターゲット関数のprototypeプロパティが参照するオブジェクトに基づいて新しいオブジェクトを作成します。あなたのケースでは、handleJson.prototypeによってバックアップされた新しいオブジェクトです。
• この新しいオブジェクトを参照すると、thisというターゲット関数（handleJson）が呼び出されます。
• ターゲット関数が何かを返さない場合、またはプリミティブな値を返した場合、またはnullを返した場合、newは結果として作成したオブジェクトを取得します。ターゲット関数が非nullオブジェクト参照を返す場合、はをデフォルトに上書きし、newはそのオブジェクト参照をその結果として取ります。

元のコードでは、その最後の点が有効になりました。

---

サイドノート：あなたはthatを宣言していなかったbecuseあなたのコードがThe Horror of Implicit Globalsに獲物を落下ました。上にvarを追加しました。

---

サイドノート：JavaScriptで圧倒的な慣例はコンストラクタ関数（あなたがnew経由で呼び出している関数は）大文字で始まるということです。また、通常はの名詞動詞ではなく、です（他の種類の関数は通常は動詞ですが、コンストラクタ関数ではありません）。したがってhandleJsonではなくJsonHandlerです。