Làm cách nào để thêm chức năng mẫu vào trình xử lý sự kiện trong chức năng khởi tạo?

Question

Tôi không chắc chắn chính xác làm thế nào để cụm từ câu hỏi của tôi, vì vậy hãy để tôi trình bày một ví dụ:

function foo() { 
    window.addEventListener("keydown", function(event) { 
     bar(event.keycode); 
} 

foo.prototype.bar = function (keycode) { 
//code 
} 

Tôi đã cố gắng sử dụng this.bar(), nhưng mà kết quả trong việc sử dụng window như this. Có cách nào để làm điều này, hoặc tôi sẽ phải gọi một phương pháp khởi tạo thủ công?

Answer 1

Bind this.bar đến this trước khi bạn vượt qua.

function foo() { 
    window.addEventListener("keydown", this.bar.bind(this), false); 
} 


foo.prototype.bar = function (event) { 
    console.log(event.keyCode); 
} 

bản demo http://jsfiddle.net/2tee4/

Answer 2

Một giải pháp thay thế nếu bạn không có Function.prototype.bind * có sẵn, và bạn không muốn thêm chức năng bổ sung để Function.prototype sẽ được đóng trên lời kêu gọi this.bar:

function foo() { 
    var self; 
    self = this; 
    window.addEventListener('keydown', function (e) { 
     self.bar(e); 
    }, false); 
} 
foo.prototype.bar = function (e) { 
    console.log(e.keyCode); 
} 

_{* mặc dù bạn sử dụng addEventListener mà không cần attachEvent dẫn tôi tin rằng Function.prototype.bind sẽ là một acce lựa chọn ptable}

---

Ngoài ra, thư viện như jQuery có thể bao gồm hình thức riêng của họ về bind, jQuery là jQuery.proxy.

Answer 3

Nếu ý định của bạn là thêm một người biết lắng nghe mới cho mỗi foo tạo ra, tùy chọn khác là để làm cho foo thực hiện EventListener giao diện , và chỉ cần vượt qua this ở vị trí của điều khiển.

function Foo() { 
    window.addEventListener("keydown", this, false); 
} 

Foo.prototype.bar = "foobar"; 

Foo.prototype.handleEvent = function(e) { 
    console.log(e.type); // "mousedown" (for example) 
    console.log(this.bar); // "foobar" 
}; 

new Foo(); 

Lưu ý rằng thao tác này chỉ hoạt động với addEventListener().

DEMO:http://jsfiddle.net/k93Pr/