javascript - 如何在javascript中调用实例化类的函数？

Question

说实话，我可以调用该函数，但只能以硬编码方式调用。我不想对提交绑定(bind)我的 getData 函数进行硬编码，而是想通过参数调用该函数。请帮助我，如何做到这一点。

谢谢。

formhandler = new xForm.Main(); // new formhandler
formhandler.setForm(this.formid); // fn.setForm(string) // configure the container, which has the form elements, or the form itself
modal = new xModal.Main(); // new modal handler
modal.setModal(this.modalid); // set modal element
modal.showModal(); // show
modal.bindClose(".cancel"); // bind closing classes
modal.bindSubmit(".submit", formhandler, "getData"); // bind submit to call formhandler.getData()

在 xModal.js 中

var xModal = xModal || {};

xModal.Main = function()
{
  var self = this;
  ...

this.bindSubmit = function(classname, a, b)
{
    this.closeclass = classname;
    $("#"+this.target).find(classname).click(function(){
        a.call(b); // edited after the original post, i forgot to replace the call's argument to b in the question excuse me for the inaccuracy
    });
}

这个函数应该调用 xForm 中的 getData(这里是 xForm 的片段)

var xForm = xForm || {};

xForm.Main = function()
{
var self = this;
this.target = "";
this.data = {};

...

this.getData = function()
{
    getSingleElements();
    getMultiElements();
    return returnData();
}

---

更新:

我想我只是找到了一种方法来做到这一点，但如果我做错了什么，请告诉我，或者你有更好的解决这个问题的方法(我很确定有人有)

我想，我有正确的方法。

在xForm中我做了一个fn，它通过self中包含的参数调用函数(实际上等于这个)

var xForm = xForm || {};

xForm.Main = function()
{
var self = this;

this.callFn = function(func)
{
    return self[func].call(this);
}

...

然后我从另一个类 (xModal) 调用 fn

var xModal = xModal || {};

xModal.Main = function()
{
var self = this;
this.bindSubmit = function(classname, a, b)
{
    this.closeclass = classname;
    $("#"+this.target).find(classname).click(function(){
        a.callFn(b);
    });
}

然后我只需要告诉 xModal 这个:

modal.bindSubmit(".submit", formhandler, "getData"); // bind submit to call formhandler.getData()

所以现在模态类将调用 args[1] 的 args[2] 函数。还可以通过 apply 方法为调用 fn 提供更多参数。

在我身上工作得很好，但我不知道，也许你可以帮助我让它变得更好。

Answer 1

您将某个对象的方法名称绑定(bind)到提交事件:

modal.bindSubmit(".submit", formhandler, "getData");

但是您还想将参数传递给该方法。这不是 Javascript 的做法。相反，只需将一个匿名函数绑定(bind)到该事件，然后从这个匿名函数中调用您喜欢的方法:

modal.bindSubmit(".submit", function(){
    formhandler.getData("My arguments");
});

您在我的示例中看到的是作为参数传递的匿名函数。在 Javascript 中，字符串或整数等值与函数之间没有区别。可以将函数分配给变量，并作为参数传递。

为了更清楚，也可以这样写:

var eventHandler = function(){
    formhandler.getData("My arguments");
};

modal.bindSubmit(".submit", eventHandler);

这称为“一流函数”，是“函数式编程”范式的一部分。

在事件处理函数内部，您仍然可以访问创建它的 scooe 中的变量，例如 formhandler 对象。这称为“关闭”。

阅读此内容。一开始它会让您感到困惑，但它确实值得您花时间，因为它会让您大开眼界，找到更简单的解决方案。

根据您的示例，我不确定对象模态是什么。如果它是一个 jQuery 元素，我的示例应该会立即运行，否则，您将需要更新代码以调用作为事件处理程序传入的函数，而不是调用对象上的方法。