Javascript - Web 应用程序结构

Javascript - web application structure

本文关键字：结构 应用程序 Web Javascript      更新时间：2023-09-26

我在管理Javascript应用程序各部分之间的数据时遇到问题。我试图坚持使用"MVC"模式，所以用MVC术语来说，我不能让我的一些"C"（控制器）函数访问"M"（模型）给出的数据。具体来说，我不能在不使数据全局的情况下使事件函数访问数据（我想尽量避免）。

一个虚构的情况只是为了告诉你我的意思：

.HTML：

<body>
    <div onclick="func()"></div>
</body>

.JS：

var Data = function(num) {
    this.num = num;
}
window.onreadystatechange = function() {
    var data = new Data(5);
}
function func() {
    //How do i access the object "data" from here?
}

问题是：如何使事件处理程序访问数据？

var Data = function(num) {
    this.num = num;
}
var data;
window.onreadystatechange = function() {
    data = new Data(5);
}
function func() {
    //data.num
}

您必须在函数可访问的范围内声明数据

如果你担心全局变量，你可以这样做

var service = {};
(function(service) {
    var Data = function(num) {
        this.num = num;
    }
    var data;
    window.onreadystatechange = function() {
        data = new Data(5);
    }
    service.func = function func() {
        //data.num
    }
})(service);

//call the function
service.func();

这将在自执行闭包中调用它，这将阻止变量进入全局范围。可以传入服务实例并将 func 方法附加到该实例以便能够调用它。Jquery 插件通常遵循这种模式。

相关文章：