本篇文章主要介紹了JavaScript檔案的同步和非同步載入的實作程式碼,具有一定的參考和學習JavaScript的價值,對JavaScript感興趣的可以了解一下本篇文章 對於JS檔案的引用,儘管目前有不少框架和工具(例如webpack,commonjs,requiresjs等)都做了很好的處理。但拋開這些框架,了解原生的載入方式還是不無裨益。本文簡述一些js檔案的同步和非同步載入方式。 同步載入 可在html檔案裡以標籤插入,這是初學時最基本的方式。 </p> <p>準備兩個js檔案如下:<br></p> <p>calc1.js</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;">console.log('calc1 loading begin') function add(...args) { return args.reduce((currentTotal, i) => currentTotal + i, 0); } console.log('calc1 loading end')</pre><div class="contentsignin">登入後複製</div></div><p>calc2.js</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;">console.log('calc2 loading begin') console.log(add(1,2,3)) console.log('calc2 loading end')</pre><div class="contentsignin">登入後複製</div></div><p>calc2.js 是依賴calc1.js的。 </p><p>html檔案如下:</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:xhtml;"><body> <script src="calc1.js">