遗漏的类型错误：方法是不是一个函数

Question

代码：

function Hotel(name,rooms,bookings){ 

    this.name = name; 
    this.rooms = rooms; 
    this.bookings = bookings; 

    this.checkAvailability = function(){ 
     return this.rooms - this.bookings; 
    } 

    this.bookRoom = function(){ 
     if(this.checkAvailability() > 1){ 
      return this.bookings++; 
     } 
    } 

    this.cancelBooking = function(){ 
     if(this.bookings < 1){ 
      return this.bookings--; 
     } 
    } 
} 


var grandHotel = new Hotel('Hotel Grand', 20, 5); 
var addBooking = document.getElementById("book"); 

addBooking.addEventListener('click', grandHotel.bookRoom, false); 

如果我点击addBooking元素我得到这个错误：

Uncaught TypeError: this.checkAvailability is not a function.

Answer 1

您需要更改的事件是如何被约束。

addBooking.addEventListener('click', grandHotel.bookRoom.bind(grandHotel), false); 

或

addBooking.addEventListener('click', function() { grandHotel.bookRoom(); }, false);