JavaScript 对象文字表示法未按预期工作

Question

我正在使用 jQuery 1.7。我正在尝试了解命名空间应该如何工作。我可以让某些部分工作，但不能完全按照我的预期工作。我希望当输入表单元素时，函数 checkPasswordForm 将触发并警告字段的值。

我有这个表单元素。

<input type='text' id='Password'>

我希望这段代码将创建一个命名空间、创建一个对象并创建一个函数。

// SET NAMESPACE
var nsPASS = {

$Password: $('#Password'),

checkPasswordForm: function() {
    var Password = $Password.val();
    alert(Password);
}

};
nsPASS.$Password.keyup(nsPASS.checkPasswordForm);

但是该代码无法运行。我收到一条错误消息，指出 $Password 未定义。我以一千种不同的方式修改了代码以使其正常工作。下面的版本按照我的预期工作。看起来代码比完成任务所需的代码要多。

// SET NAMESPACE
var nsPASS = {

$Password: $('#Password'),

init: function() {
    $Password = $('#Password');
},

checkPasswordForm: function() {
    var Password = $Password.val();
    alert(Password);
}

};

nsPASS.init();
nsPASS.$Password.keyup(nsPASS.checkPasswordForm);

在第二个示例中，如果我删除 nsPASS.init()，代码就会中断。如果我删除密码:$('#Password')，代码就会崩溃。

我可以定义对象然后立即在函数中使用它们吗？为什么第一个示例有效，但第二个示例无效？

Answer 1

JavaScript 没有命名空间，只有对象。如果对象的属性具有某些值，则不能只像变量一样使用属性名称，您始终需要通过对象来寻址它。

In the second example, if I remove nsPASS.init(), the code breaks. If I remove Password: $('#Password') the code breaks.

这是因为一个是隐式全局变量(在 init 函数中分配，在 checkPasswordForm 函数中使用) - 另一个是您的 的属性nsPass 对象(在对象文字中初始化，在 nsPASS.$Password.keyup(…) 调用中使用)。所以改成

var Password = nsPass.$Password.val();

如果您正在编写始终在命名空间对象的上下文中调用的函数(作为方法)，则可以使用 this keyword作为对象的引用。然而，您的特定函数将作为事件处理程序调用，因此其上下文是#Password 输入本身。您可以轻松地将其更改为

var Password = $(this).val(); // or shorter: this.value;