在写js代码之前，想通过代码动态插入一定数量的js文件到html中。文件的依赖关系已按顺序排列。关键代码大致如下：varjsFiles=['somepath/a.js','somepath/b.js',...];varhead=document.head;jsFiles.forEach((file)=>{varscript=document.createElement('script');script.type='text/javascript';script.src=file;head.appendChild(script);});但是在代码执行的过程中，非常频繁的报同样的错误，大概意思就是：b.js在执行过程中引用的a.js中的方法不存在。错误率很高，但也不是100%错误。通过分析，我认为原因应该是这样的：虽然我是按照数组中定义的顺序动态创建脚本标签来加载相应的js文件，但是由于文件大小和网络等因素，每个文件的顺序是完成不是现在。完全等于请求的顺序。比如上面的例子，如果a.js文件比较大，下载速度比b.js慢，所以b.js在下载执行的时候，会依赖a.js中的变量或者方法得不到。到达。想到的解决方案是等到上一个文件加载完毕后再加载下一个文件。大致代码如下：');script.type='text/javascript';script.onload=function(){i++;if(i===jsFiles.length){resolve();}else{load(i);}}脚本。src=file;head.appendChild(script);};load(0);});}上面的方法也可以改成chainPromiseCall或者callback嵌套，虽然最后解决了问题，但是有个问题就是文件从异步加载到同步加载，增加了文件下载的时间，而且文件越多,影响越明显。所以正确的思路应该是异步加载文件，但是在执行一个文件的时候，需要等到它所依赖的文件先被加载执行。对于这个问题，可以借鉴require.js等第三方库，或者es6中引入的模块优化功能，完美解决了这些问题。
