Ý nghĩa của từ khóa "này" trong jQuery Vs MVC

Question

Tôi đang cố gắng hiểu sự khác biệt của việc sử dụng từ khóa "này" hoặc đúng hơn là những gì nó đại diện trong jQuery Vs một khung MVC như Backbone.

Dưới đây là 2 mẫu mã của mỗi loại; Vì vậy, trong jQuery, chúng tôi có

$("#result").click(function(){ 
$(this).html(someval); 
}) 

Trong xương sống, chúng tôi có mã như;

var HandlebarsView = Backbone.View.extend({ 
el: '#result' 
initialize: function(){ 
this.template = Handlebars.compile($('#template').html());  
}, 
render: function(){ 
var html = this.template(this.model.toJSON()); 
this.$el.html(html); 
} 
}); 

Bây giờ tôi hiểu rằng "điều này" đề cập đến phần tử DOM trong jQuery.

Tôi muốn hiểu nội dung thể hiện trong trường hợp mã Backbone.

Vui lòng cho tôi biết.

Answer 1

this là ngữ cảnh trong đó một hàm thực thi.

Bí quyết để hiểu được this hiểu rằng đó là cách bạn thực hiện một hàm xác định hàm.

Khi bạn chuyển một hàm vào một phương thức như jQuery, bạn đang sử dụng hàm đó làm phương thức gọi lại. jQuery đặt rõ ràng ngữ cảnh của cuộc gọi lại khi nó thực thi.

Khi bạn gọi một phương thức trên một đối tượng bằng cách sử dụng ký hiệu chấm: myView.render() đó là dấu chấm cho biết rõ ràng bối cảnh cuộc gọi phương thức cho đối tượng ở phía trước dấu chấm.

Quy tắc cho ngữ cảnh được đặt là khá đơn giản trong JavaScript, nhưng có thể gây ra nhiều nhầm lẫn. Hầu hết các ngôn ngữ đặt biến ngữ cảnh tự tham chiếu đến đối tượng mà phương thức đã được định nghĩa. JavaScript, mặc dù, sử dụng mẫu gọi phương thức để xác định ngữ cảnh.

Khi chúng ta truyền phương thức của bất kỳ đối tượng nào xung quanh như một phương thức gọi lại, mã gọi nó đặt ngữ cảnh của phương thức - bao gồm khung nhìn của Backbone và các đối tượng khác. Bạn có thể ghi đè điều này một cách rõ ràng bằng cách sử dụng các hàm bind và bindAll của Underscore.js (http://documentcloud.github.com/underscore/#bind), cũng như một vài thủ thuật khác.

Backbone.View.extend({ 
    initialize: function(){ 
    _.bindAll(this); 
    } 
}); 

Mã này, ví dụ: sẽ ràng buộc bối cảnh của tất cả các chức năng trên đối tượng chế độ xem hiện tại, cho chế độ xem. Điều này đảm bảo rằng ngữ cảnh của các phương thức xem của bạn sẽ luôn là chính chế độ xem.

Để biết thêm thông xem:

• http://es5.github.com/ - chú thích đặc điểm kỹ thuật ES5
• http://yehudakatz.com/2011/08/11/understanding-javascript-function-invocation-and-this/
• http://lostechies.com/derickbailey/2011/06/15/solving-backbones-this-model-view-problem-with-underscore-js/
• http://www.watchmecode.net/javascript-context (thu hình màn ảnh của riêng tôi bao gồm tất cả các quy tắc và cách sử dụng chúng - một screencast trả tiền)

Answer 2

Trong xương sống 'này' bên trong chế độ xem đề cập đến đối tượng chế độ xem hiện tại. Trong các mô hình 'này' đề cập đến đối tượng mô hình hiện tại. Và tương tự cho các bộ sưu tập 'này' đề cập đến đối tượng bộ sưu tập hiện tại. Tuy nhiên đối với các khung nhìn 'this' là thoáng qua giữa phần tử dom đã chọn bởi jQuery và đối tượng xem, đó là lý do tại sao chúng ta sử dụng hàm _.bindAll để chúng ta có thể đảm bảo rằng 'this' vẫn là đối tượng view hiện tại khi chúng ta đang gọi các chức năng nhất định như 'hiển thị', v.v. Xem http://documentcloud.github.com/underscore/#bindAll