javascript - 从内存中卸载 Javascript

Question

我正在考虑浏览器上的 Web 应用程序。我可以在遍历应用程序的不同部分时根据需要动态添加所需的 js 文件，但是随着内存使用量的增加，我可以从当前 session 的“内存”中卸载不需要的 js 内容吗？

我知道可以删除负责内容的标签，但不能保证它最终会卸载并取消绑定(bind)与该内容对应的所有内容。

谢谢

Answer 1

I know it is possible to remove the tag responsible for the content but it is not assured that it will eventually unload and unbind everything correspondent to that content.

事实上，可以肯定的是它不会。加载并执行 JavaScript 后，它与加载它的 script 元素之间根本没有任何链接。

您可以动态加载和卸载模块，但您必须通过以下方式将其设计到您的代码中

• 让一个模块有一个单一的符号来引用整个模块
• 具有“卸载”功能或类似功能，负责删除模块的所有事件监听器等

然后卸载模块就是调用它的 unload 函数，然后将引用它的符号设置为 undefined (或者完全删除它，如果它是一个属性在一个物体上)。

这是一个非常简单的概念演示(如果您使用某种异步模块定义库，您会对其进行调整):

// An app-wide object containing a property for each module.
// Each module can redefine it in this way without disturbing other modules.
var AppModules = AppModules || {};

// The module adds itself
AppModules.ThisModule = (function() {
    var unloadCallbacks = [];

    function doThis() {
        // Perhaps it involves setting up an event handler
        var element = document.querySelector(/*...*/);
        element.addEventHandler("click", handler, false);
        unloadCallbacks.push(function() {
            element.removeEventHandler("click", handler, false);
            element = handler = undefined;
        });

        function handler(e) {
            // ...
        }
    }

    function doThat() { 
        // ...
    }

    function unload() {
        // Handle unloading any handlers, etc.
        var callbacks = unloadCallbacks;
        unloadCallbacks = undefined;
        callbacks.forEach(function(callback) {
            callback();
        });

        // Remove this module
        delete AppModules.ThisModule;
    }

    return {
        doThis: doThis,
        unload: unload
    };
})();

回调机制非常粗糙，您需要更好的东西。但它展示了这个概念。