0

我不明白一件事：

 var comein = document.getElementById("comein");

 var enter = new Expand({ elem : comein });

function Expand (options) {
    this._elem = options.elem;
    console.log(this._elem); // i have a div element    
}

Expand.prototype = {        
    check : function () {

        var comInClassName = this._elem.className; // i have an error: this._elem is undefined

        if (comInClassName == "open"){
          this.close();
        }
        if (comInClassName == "close"){
          this.open();
        }
    }
}
log_in.addEventListener("click",  enter.check, false);

如果在扩展中我有一个普通元素，为什么我在原型方法中有错误？谢谢

4

1 回答 1

6

这完全取决于您如何调用 check. 如果你这样称呼它：

enter.check();

....然后在调用中，this将引用该enter对象并且它将具有一个_elem属性。另一方面，如果您将其设置为这样调用：

enter._elem.addEventListener('click', enter.check, false);

...然后在调用中（当事件发生时），this不会引用，而是引用，因此它没有属性。enterthis._elem_elem

发生这种情况是因为在 JavaScript（目前）中，this函数调用完全由函数的调用方式定义，而不是函数的定义位置。如果您将其作为从对象中检索函数引用的表达式的一部分来调用：

enter.check();

...然后this是指您从中获得函数引用的对象。但是如果你单独调用它，就像addEventListener上面的调用一样，它不会。

如果您在启用 ECMAScript5 的环境中（或者如果您有一个不错的 ES5 垫片），您可以使用以下方法修复它Function#bind：

enter._elem.addEventListener('click', enter.check.bind(enter), false);

bind返回一个函数，当被调用时，它将转身并使用给定的this值调用底层函数（enter在我们的例子中）。

更多探索（在我的博客上）：

于 2013-02-11T16:32:05.850 回答