如何管理JavaScript文件并封装JavaScript / jQuery函数

Question

我需要为当前项目编写和管理大量JavaScript代码。

我主要根据模块将它们分为多个.js文件。

所以，现在我有例如：

Map.js // deal with google map issue
Common.js // common functions that will share by all modules
User.js // user module js code
Geofence.js // geofence module js code
etc.....

例如，在我的User.js文件中

如果我想声明一个仅在User.js文件内部使用而外部无法访问的函数，该怎么办。 我能做什么？

var User = {};

User.registerModule = function () {
    $('#user').click(function () {
        Common.showLeftScrollbar();

        getAllUsers();

        // ...
    });
}

function getAllUsers(){ // how to hide this function
    // get
    return users;
}

因此，在我的主页中，我只需要与多个.js文件进行协调。 访问允许访问的内容。

  $(document).ready(function (data) {

        GoogleMap.initialiseGoogleMap();

        Common.refreshRightScrollbar();

        User.registerModule();

        // ...
    });

这是我第一次编写js，而没有足够的时间学习整本书。 因此，请您认为，这种结构可以用于许多js代码吗？ 以及如何隐藏我不希望外部访问的功能？

Answer 1

隐藏该功能，您有不同的可能性

1. 只需将您的代码包含在立即执行的匿名函数中

    var User = {}; // this should not be enclosed too (function() { User.registerModule = function () { $('#user').click(function () { Common.showLeftScrollbar(); getAllUsers(); // ... }); } function getAllUsers(){ // how to hide this function // get return users; } })(); 

2. 将该函数包含在User.registerModule函数中

    User.registerModule = function () { function getAllUsers() { ... } $('#user').click(function () { Common.showLeftScrollbar(); getAllUsers(); // ... }); } 

Answer 2

将此函数放在范围内：

User.registerModule = function () {
    function getAllUsers(){ // how to hide this function
        // get
        return users;
    }
    $('#user').click(function () {
        Common.showLeftScrollbar();

        getAllUsers(); // returns users

        // ...
    });
}

而且它将是私有的 。

现在，如果您尝试在外部调用此函数，它将是undefined ：

getAllUsers(); // undefined.