Javascript:对象内部的函数不工作

Javascript: Function inside object not working

本文关键字：函数 工作 内部 对象 Javascript      更新时间：2023-09-26

我试图在Javascript中创建一个控制器，它将响应按钮单击并相应地更改视图。

我有一个函数是这样工作的:

document.getElementById("reset").onclick = function () { 
    //do something
   };

然而，当我试图将函数放在控制器对象中时，我得到一个"意外的令牌"错误:

var controller = {
  this.reset = document.getElementById("reset").onclick = function () { 
    //do something
   };
}

有两件事我不确定:

  1. 如何修复此错误?(我知道这是由于范围，但不知道如何修复它的方式，仍然遵循MVC模式)
    2. 一般来说，这是一个好方法去创建一个控制器对象吗?(我是新的MVC模型，不知道我是否遵循最佳实践。)

谢谢。

这个错误是由于不能像那样声明对象，有不同的方法可以做到:

var obj1 = { 
    a : function() { 
        console.log('obj1'); 
    } 
};
var obj2 = function() { 
    var b = function() { 
        console.log('obj2');
    };
    return { 
        a: b
    }
};
var obj3 = function() {
    this.a = function() { 
        console.log('obj3'); 
     } 
};

然后使用它

obj1.a; //prints obj1
obj2().a; //prints obj2
new obj3().a; //prints obj3.

关于如何组织你的对象是基于意见的，但我喜欢这样做。

var Controller = function() {
    this.attachEvents = function() {
        document.getElementById("reset").onclick = reset;
    }
    var reset = function() {
        console.log('reset');
    };
}
new Controller().attachEvents();

另一个选项是…

var Controller = function() {
    this.reset = function() {
        console.log('reset');
    };
}
var controller = new Controller();
document.getElementById("reset").onclick = controller.reset;

这不是一个有效的Javascript对象结构，但如果它适合您，您可以在下面这样做

var controller = {
  reset : function () { 
    document.getElementById("reset").onclick = function(){
       //do your work here
     }
   }
}

逻辑完全取决于你/开发者他/她想如何处理事情。

或者你可以在外面做绑定，比如

var controller = {
      reset : function () { 
         //what to do to rsest
       }
    }

，然后在别处绑定

//when to run reset method
document.getElementById("reset").onclick = controller.reset;
相关文章：