如何用自己的函數改變對象的屬性？

Question

這是來自我自己的js文件。

function hesap (hesapdiv, hesapmodal, hesapid){ 
    this.hesapid = hesapid; 
    this.hesapdiv = hesapdiv; 
    this.hesapmodal = hesapmodal; 

    hesapdiv.on("click", "button", function() { 
     hesapmodal.modal("show"); 
    }); 


    hesapmodal.on("click", "button[hesapid]", function() { 
    var hesapid = $(this).attr('hesapid'); 
    console.log(this.hesapid + "-" + hesapid + "-" + $(this).attr('hesapid')); 
    var isim = $(this).attr('isim'); 
    hesapdiv.find("input").val(hesapid + " - " + isim); 
    hesapmodal.modal('hide'); 
    });} 

而下面的代碼，我可以在我的所有網頁中使用。

var hesap1 = new hesap($("#hesapdiv"), $("#HesaplarModal"), 36); 
$("#kasaislemikaydet").on('click', function(event) { 
     event.preventDefault(); // To prevent following the link (optional) 
     alert(hesap1.hesapid);)}; 

現在，當用戶從模態中選擇'hesap'時，函數成功獲取屬性的值。但它不會將值分配給對象的'hesapid'。所以從網頁我不能得到hesapid的新價值。例如，點擊一個按鈕來獲得新選擇的'hesapid'的值，總是會提醒第一個值'36'。

Answer 1

var _this=this; //save this to variable 

hesapmodal.on("click", "button[hesapid]", function() { 

    console.log(_this.hesapid);//here You have object property and it can be changed 
    //example assign 
    _this.hesapid = $(this).attr('hesapid'); 

}); 

我創造_this變量，因爲這在點擊事件的回調是在其被稱爲事件的DOM元素，所以在創建_this變量我們這個（hesap對象）引用該在回調函數中可見並且可以在那裏使用。

全部工作代碼：

function hesap (hesapdiv, hesapmodal, hesapid){ 

    this.hesapid = hesapid; 
    this.hesapdiv = hesapdiv; 
    this.hesapmodal = hesapmodal; 

    var _this=this;//to use this in click callback 

    this.hesapdiv.on("click", "button", function() { 

     _this.hesapmodal.modal("show"); 
    }); 


    this.hesapmodal.on("click", "button[hesapid]", function() { 

     _this.hesapid = $(this).attr('hesapid'); 

     var isim = $(this).attr('isim'); 

     _this.hesapdiv.find("input").val(_this.hesapid + " - " + isim); 

     _this.hesapmodal.modal('hide'); 

    }); 

}

Answer 2

function hesap (_hesapdiv, _hesapmodal, _hesapid){ 
    var self = this; 
    this.hesapid = _hesapid; 
    this.hesapdiv = _hesapdiv; 
    this.hesapmodal = _hesapmodal; 

    hesapdiv.on("click", "button", function() { 
     self.hesapmodal.modal("show"); 
    }); 


    hesapmodal.on("click", "button[hesapid]", function() { 
    var hesapid = $(this).attr('hesapid'); 
    console.log(self.hesapid + "-" + hesapid + "-" + $(this).attr('hesapid')); 
    var isim = $(this).attr('isim'); 
    self.hesapdiv.find("input").val(hesapid + " - " + isim); 
    self.hesapmodal.modal('hide'); 
    });} 

在javascript this指功能this是

ES6有一個更好的方式來處理這個

。

function hesap (hesapdiv, hesapmodal, hesapid){ 
    this.hesapid = hesapid; 
    this.hesapdiv = hesapdiv; 
    this.hesapmodal = hesapmodal; 

    hesapdiv.on("click", "button",() => { 
    hesapmodal.modal("show"); 
    }); 


    hesapmodal.on("click", "button[hesapid]",() => { 
    var hesapid = $(this).attr('hesapid'); 
    console.log(this.hesapid + "-" + hesapid + "-" + $(this).attr('hesapid')); 
    var isim = $(this).attr('isim'); 
    hesapdiv.find("input").val(hesapid + " - " + isim); 
    hesapmodal.modal('hide'); 
}); 
} 

購買使用() =>而不是function()在ES6 this回到父母function()。在你的情況下，hesap函數。