Question

制作jQuery小部件时，请解释一下this的概念吗？

当我在函数this.shell中创建变量_createMyShell时，为什么它可用于整个小部件。它应该只适用于该功能吗？

还是为widget对象的上下文创建属性？请你解释一下？

function ($, undefined) {    
  $.widget('hhh.myTestWidget', {    
    version: 'alpha',

    _create: function () {
        this.element.addClass('hhh.myTestWidget');
        this._createMyShell();
        this._renderMyStuff();    
        //console.log(this.element);
        //console.log(this.options);        
    },

    _createMyShell: function () {     
        this.shell = $('<div>this is my shell</div>');
    },

    _renderMyStuff: function () {    
        this.shell.appendTo(this.element);    
    }    
  });    
}(jQuery));

Answer 1

即使您的代码不是小工具，this.shell = foo也只是向变量shell添加新属性this。

但是this是基于函数调用的 context 确定的，而jQuery UI小部件包装器确保this始终设置为创建的新对象包含所有显示的方法。

Answer 2

函数中的

this表示对象Widget。窗口小部件中的每个功能都分配给同一个对象。必须在您的窗口小部件中声明_createMyShell，如：Widget.prototype._createMyShell = function(){}。然而我无法向你保证它就是这样，还有其他可能性，但你的函数[this]的上下文将是小部件（某些方法，如bind，call和apply可以重新绑定上下文。）

现在您知道this是窗口小部件对象，您可以为其指定属性，例如shell。但由于其他功能已附加到窗口小部件，并且您将shell附加到窗口小部件，因此您可以在所述窗口小部件内部或访问窗口小部件对象时访问它。

Answer 3

我认为你很困惑，因为Javascript中的函数是对象。但是在函数this中是对执行上下文的引用。如果你只是打电话......

function doSomething() {
    console.debug(this);
}
doSomething();

你得到了浏览器的窗口对象。但作为例外，当函数是对象的属性时，this绑定到该对象。使用this实例化函数时，函数将new绑定到该函数。为了显示差异，下一个示例中的this'共享相同的引用：

var a = function() {
    this.doSomething = function() {
         console.debug(this);    
    }
}
var b = new a;
b.doSomething();

jQuery小部件------这个的上下文？

3 个答案: