JAVA初始化语句会执行几次,JavaScript是否会在这些语句中初始化/执行任何内容？...

布满荆棘的人生 2022-11-15 14:26 117阅读 0赞

好的开始，JavaScript按照您在文档中定义的顺序执行，要么是一段代码，要么是脚本标记指向的物理文件，但完整的解析取决于文件大小和网络响应因此多个文件按定义的升序开始，并以不同的时间间隔完成加载 .

您可以使用 defer 和 async 属性使脚本加载异步 . Link .

要了解执行流程，请使用jquery查看具有类似代码的 stackoverflow link .

要获得您问题的明确答案，请阅读以下内容，以清楚了解各自的图书馆

RequireJS(AMD)：

RequireJS查找首先按照在entrypoint中的config中定义的JS文件的名称或在require方法数组中定义的依赖项进行 .

例如，让我们看看下面的代码：

bundle.js

define("X", \[\],function()\{ //named definition without any dependencies.

return function() \{

alert("Loaded");

\});

index.html

require(\["require", "X"\],function (require) \{ //"X" is defined in the array of require definition

var X = require("X");

X();

\});

所有的依赖关系都与AMD中的回调相连，以解决加载时间差异，从某种意义上说，这些模块在使用内存中加载的所需模块执行回调时可用 .

Browserify：

在浏览器上模拟客户端的Node JS模块加载 .

How stuff works:

额外构建步骤可以连接所有在require函数之前可用的依赖函数定义 . 所有代码文件都捆绑在一个文件中，该文件在运行时在单个作用域中可用 . 使用r.js优化器可以在RequireJS中实现类似的功能 .

关于browserify，请阅读link

Example code for illustrations:

mod1.js：

module.exports = function()\{

alert("Loaded");

\};

构建命令：

browserify -r ./mod1.js:mod> bundle.js

这将生成一个名为 bundle.js 的文件，其模块名称为 mod ，可以包含在index.html中，如下所示

(function () \{

var X = require('mod');

X();

\})();

这里browserify从入口点代码 (Here its mod1.js) 开始定义所有JS文件，并递归搜索require api并在这些模块之上构造闭包范围 .

因此你的bundle.js如下所示

require=(function e(t,n,r)\{function s(o,u)\{if(!n\[o\])\{if(!t\[o\])\{var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE\_NOT\_FOUND",f\}var l=n\[o\]=\{exports:\{\}\};t\[o\]\[0\].call(l.exports,function(e)\{var n=t\[o\]\[1\]\[e\];return s(n?n:e)\},l,l.exports,e,t,n,r)\}return n\[o\].exports\}var i=typeof require=="function"&&require;for(var o=0;o

module.exports = function()\{

alert("Loaded");

\};

\},\{\}\]\},\{\},\[\]);

结论：

Browserify: 函数一次加载，因为所有文件都连接成一个JS文件 . 因此，所有定义和函数共享相同的闭包范围并初始化并在内存中可用 . 当您需要模块定义时 - >如果它的变量返回值，或者如果它是一个函数然后指针，则返回函数，您可以在其中进行函数调用 .

AMD as RequireJS: 这是相当不同的，因为文件在运行时需要调用执行时加载，稍后在解析所有依赖项后执行附加到该需求定义的回调 . 因此，在这种方法中，当需要调用 (this is called as Lazy - loading) 时，内存会逐渐重载函数 .

Note: r.js 是requireJS插件，用于优化和连接所有JS文件，与browserify相同 .