javascript - “未捕获的TypeError:未定义不是函数”在对象中调用方法时Javascript中的错误消息

从HTML中的按钮调用函数时出现问题：“未捕获的TypeError：未定义不是函数”错误。我认为这里没有任何问题。或者有些我没有考虑到。在此先感谢您的答复！

我有很多JS文件，这是因为这是学校的作业，我们现在正在学习模型，视图，控制器（MVC）方法。

我有这个按钮：

<button onClick="ControllerBKE.reageerOpKlik()">Ok!</button>

然后，我得到了创建^“ ControllerBKE”对象的Javascript代码：

"use strict"
window.onload = reageerOpStart();

function reageerOpStart()
{
    var controllerBKE = new ControllerBKE();
}

这是应该但不响应按钮的“ ControllerBKE”中的代码行：

function ControllerBKE(){
    this.reageerOpKlik = reageerOpKlik;

    function reageerOpKlik(){
        alert('hoi');
    }
}

这只是大代码的一小部分。但是，我单击按钮而不是收到“ hoi”警报时会收到错误消息。

最佳答案

您拥有的被称为closure。您的功能范围有限。也就是说，只能在定义它的ControllerBKE()内部调用它，而不能从函数外部调用它。

但是，您有效完成的工作是通过ControllerBKE实例上的属性公开该闭包。虽然这可行，但它更适合JavaScript的原型结构，以将其添加到ControllerBKE.prototype。

重要的是要记住，JavaScript是原型而不是面向对象的。尽管这可能类似于面向对象的封装，但是两者具有不同的概念和用途。

看下面的例子：

HTML：

<button onclick="controllerBKE.reageerOpKlik()">Ok!</button>

JavaScript：

"use strict";
window.controllerBKE = new ControllerBKE();

function ControllerBKE () { }

ControllerBKE.prototype.reageerOpKlik = function () {
    alert('hoi');
}

我简化了一些代码，并对其进行了重构，以支持JavaScript为我们提供的原型对象。

第一行是将controllerBKE变量添加到窗口对象。这使它在页面上具有全局作用域，使您的onclick函数可以访问它。

下一行是一个简单的函数包装器。这将创建类型为ControllerBKE的object的实例。

您尝试调用的函数现在已附加到ControllerBKE的原型中。这意味着使用ControllerBKE关键字创建的new的任何实例都可以访问此功能。

在下面的小提琴中查看全部功能：

FIDDLE

参考文献：

Object.prototype

Object Oriented JavaScript