Javascript 更好的设计以参考自己的对象'；从对象'；s法

我有一个“yesno”输入收音机。当用户单击yes时，显示yesDiv，当用户单击no时，显示noDiv

为了实现这一点，我创建了对象myObject

这是可行的，我知道我不能用它来引用方法“switchDiv”中对象的属性，因为函数中的“This”的作用域。我在一个相关问题（.）中找到了将this.config作为参数发送，然后使用self=ev.data的解决方案

但现在我的问题是：每当我想从一个对象的方法访问一个对象自己的属性时，我必须将它们作为方法中的参数传递，这不是有点奇怪吗？没有更好的方法来声明对象以避免这种情况吗？

ECMAScript 1.5（并非所有浏览器都支持）有一种方法来绑定

此

值：

this.config.InputRadio.bind('click', this.switchDiv.bind(this));

---

现在，调用绑定的

switchDiv

时，this将始终引用

myObject

，您可以直接使用

this.config

而不是传递事件数据。

如果您想确保调用

switchDiv时this

引用

myObject

，我的建议是稍微更改一下

init

函数。我还更新了

switchDiv

函数以反映这一点。您仍然需要重新分配

此

，但只能在

init

函数中进行

var myObject= {
        init: function(config){
            var _this = this;
            this.config=config;
            this.config.InputRadio.on('change',function(){
                _this.switchDiv(); // now "this" will refer to myObject, not the input
            });
        },
        switchDiv: function(){
            if (this.config.InputRadio.filter(":checked").val() === '1'){
                this.config.divYes.hide();
                this.config.divNo.show();
            }else{
                this.config.divYes.show();
                this.config.divNo.hide();
            }
        }
};

通过在匿名函数中包装对

switchDiv

的调用，可以更好地维护

此

的上下文

下面是一个演示，展示了它的实际应用：

---

在相关说明中，当将

此

赋值给变量以便在回调或其他函数中使用时，不建议使用

self

<默认情况下，code>self是

window.self

的快捷方式，它是引用当前窗口的全局变量。如果您使用

self

破坏了其他代码，您不想重新分配它，除非您需要对象的公共API，否则我认为您最好不要创建这样的对象。将所有状态保持在隐藏范围内，如中所示

或者，如果您只需要一个，则不要公开该函数：

(function(radioName, yesId, noId) {
    var divYes = $("#" + yesId), divNo = $("#" + noId),
        radios = $("input[name=" + radioName + "]");
    radios.click(function() {
        if ($(this).val() === "1") {
            divYes.show();
            divNo.hide();
        } else {
            divYes.hide();
            divNo.show();
        }
    });
}("yesno", "yesDiv", "noDiv"));

---

（但如果您不需要多个开关，则可以用更简单的方法来实现后者。）

当调用

switchDiv

时，“this”是单选按钮。因此它不能同时是

myObject

。通过调用

$（this.val（）

，可以利用它作为单选按钮的优势。它不可能同时是单选按钮和

myObject

。是否有任何理由认为它必须位于特定对象中？使用这样的公共API？在构建之后，您是否保留

myObject

？您是调用它的public

init

和

switchDiv

方法还是再次寻址它的public

config

属性？也许代码应该隐藏在维护状态但不提供公共接口的匿名闭包中。这忽略了对象的函数已绑定到单选按钮的事件处理程序这一点。当它被触发时，

这个

现在是单选按钮；为了更好地回答眼前的问题，我编辑了我的答案

var createYesNoToggler = function(radioName, yesId, noId) {
    var divYes = $("#" + yesId), divNo = $("#" + noId),
        radios = $("input[name=" + radioName + "]");
    radios.click(function() {
        if ($(this).val() === "1") {
            divYes.show();
            divNo.hide();
        } else {
            divYes.hide();
            divNo.show();
        }
    });
};

createYesNoToggler("yesno", "yesDiv", "noDiv");

(function(radioName, yesId, noId) {
    var divYes = $("#" + yesId), divNo = $("#" + noId),
        radios = $("input[name=" + radioName + "]");
    radios.click(function() {
        if ($(this).val() === "1") {
            divYes.show();
            divNo.hide();
        } else {
            divYes.hide();
            divNo.show();
        }
    });
}("yesno", "yesDiv", "noDiv"));