Объект не распознает функцию

Question

У меня есть 3 функции на объект прототипа:

Job.prototype.postData = function(url){ 
     this.getFormData(); 
     var formdata = new FormData(); 
     formdata.append("position", this.position); 
     formdata.append("team", this.team); 
     formdata.append("details", this.details); 
     $.post(url, formdata, function(response){ 
       alert(response.message); 
       window.location.href = '/'; 
     }); 
}; 

Job.prototype.createNew = function() { 
     var newUrl = API_URL + "/add_listing"; 
     this.postData(newUrl) 
}; 

Job.prototype.update = function() { 
     var updateUrl = API_URL + "/edit_listing" + "?id=" + this.id; 
     this.postData(updateUrl) 
}; 

Я прилагаю два последних, как обработка событий обратных вызовов:

$('#list-button').on('click',job.createNew); 
$('#list-button').on('click',job.update); 

Оба эти дать TypeError:

oop.js:38 Uncaught TypeError: this.postData is not a function

Answer 1

проблема заключается в том, что просто this контекст получает потеряли способ привязки обработчика событий.

Либо явно bind контекст, или вызвать функцию таким образом, что сохраняет контекст:

$('#list-button').on('click', function() { job.createNew(); }); 
$('#list-button').on('click', job.createNew.bind(job)); 

См How does the "this" keyword work?.