addEventListener và phạm vi của

Question

Tôi có đối tượng flash của bên thứ ba mà tôi có thể thao tác thông qua API javascript mà họ cung cấp. Tôi đang tryind để nghe một sự kiện trên đối tượng này và sau đó kích hoạt sự kiện bên trong đối tượng của tôi để tăng thêm sự kiện. Tôi tình cờ sử dụng EXT Js nhưng tôi không nghĩ nó quan trọng ở đây.

Mẫu mã

this.chart.addEventListener('create', function() { 
    this.fireEvent('created'); 
}, false) 

Vấn đề của tôi là 'này' bên trong hàm ẩn danh dùng để chỉ đối tượng mà bắn sự kiện này chứ không phải là đối tượng của tôi mà tôi muốn bắn một sự kiện trên.

Vấn đề khác về phạm vi của nó. Cảm ơn trước sự giúp đỡ nào.

Answer 1

Đây là phương pháp điển hình cho vấn đề này: -

(function(self) { 
    self.chart.addEventListener('create', function() {self.fireEvent('created');}, false); 
})(this); 

Answer 2

Điều gì về việc tạo biến bên ngoài trước khi tham chiếu đến đối tượng 'this'. Ví dụ:

var _this = this; 
this.chart.addEventListener('create', function() { _this.fireEvent('created'); }, false) 

Answer 3

Trong khi câu trả lời khác thực hiện những gì bạn cần, họ không làm việc trong (khả năng mở rộng) cách hiệu quả nhất , bởi vì cuối cùng họ không tách rời đối tượng xem (this.chart) khỏi logic của chế độ xem đó (fireEvent()). Trong các ứng dụng MVC, các "quyết định" xem này nằm trong bộ điều khiển . Bộ điều khiển "điều khiển" lượt xem và phải chứa tất cả các API mà chế độ xem có thể truy cập.

Trong ví dụ của bạn, this là bộ điều khiển và điều đó tốt (điều đó có nghĩa là bạn đang thêm người nghe vào đúng nơi). Tất cả các bạn thực sự cần phải làm là gắn kết xử lý với phạm vi điều rằng nên làm như "xử lý" - trong trường hợp của bạn: this:

// `this` is the controller of `chart` 
this.chart.addEventListener('create', function() { 
    this.fireEvent('created'); 
}.bind(this)); 

gì câu trả lời khác trên trang này đã làm là làm cho nó để chế độ xem của bạn trở thành bộ điều khiển riêng, nhưng chỉ khi xử lý các sự kiện 'tạo', bằng cách gán một tham chiếu tạm thời cho "bộ điều khiển" sử dụng var self = this. Một lần nữa, điều này hoạt động tốt, nhưng nó không hoạt động tốt ở quy mô trong các ứng dụng hướng sự kiện, và nó không thực sự có ý nghĩa nếu bạn có rất nhiều sự kiện để xử lý.

.bind() là triển khai ECMAScript 5. Nếu cần thiết để làm việc trong các trình duyệt cũ hơn, một phương pháp tốt để làm như vậy được mô tả ở đây (sử dụng functions và .call()): https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Function/bind