在JavaScript中调用对象方法时，不是函数TypeError

Question

问题：

当我尝试以这种特殊方式在JavaScript中调用对象方法时，出现以下错误：

TypeError: listener.update is not a function

我的代码：

<html>
<head>
<script src="library.js"></script>
</head>
<body>
<script>

// manages listeners etc.
function Model() {
    var  listeners = [];

    this.addListener = function(listener) {
        listeners.push(listener);
    };

    // the model will call the listeners when "setting the selection"
    this.setSelection = function() {
        for (listener in listeners)
            listener.update();
    };
};

// test function that will be used as update
function moveon() {
    var answer = confirm("Ready to move on?");
    if (answer) window.location = "http://google.com";
}

// create a model and add a listener
var model = new Model();
var listnr = {};
listnr.update = moveon;
model.addListener(listnr);
// update listener
setTimeout(model.setSelection, 2000); // this doesn't work
// setTimeout(listnr.update, 2000);   // but this does

</script>
</body>
</html>

代码说明：

Model对象管理listeners列表，并在某些状态发生更改时调用其update方法。 在我的示例中，这是在调用setSelection时发生的。

注意：

该错误不是非常有见地，并且，如果我取消最后一行的注释， listnr.update可以正常工作。

题：

为什么从模型中调用方法时出现此错误，并且/或者如何解决此问题？

Answer 1

model.setSelection不保留对对象的引用。 如果不需要支持较旧的浏览器，则可以将其绑定到对象：

model.setSelection.bind(model)

如果您确实需要担心较旧的浏览器，可以使用一个小的匿名函数：

function () { model.setSelection(); }

这两种方法都将保留setSelection工作所需的对象引用。

listnr.update起作用的原因是因为该函数类型不同； 您构建了一个独立的非对象函数，并将该对象的引用设置到该对象中，因此它可以正常工作。 但是，如果您尝试使用模型进行操作，则将无法更新对象本身。