JSP 頁面代碼執行與載入順序深度解析

核心順序：Java > JSP > JavaScript/HTML

• Java/JSP：伺服器端執行，Servlet 容器處理。
• JavaScript/HTML：瀏覽器端執行，屬於回應內容的一部分。

因此伺服器端代碼永遠先於客戶端代碼執行完成。

JavaScript 在 JSP 中的載入順序

• 頁面自上而下解析，<script> 出現順序即載入/執行順序。
• 外部 JS <script src="..."> 同步阻塞後續內容渲染（除非加 async/defer）。
• 同一 <script> 區塊內，變數/函數宣告提升，但跨 <script> 區塊則需先宣告後使用。

AJAX 非同步載入陷阱

範例：頁面初始化發送 AJAX 取資料，成功回調中處理耗時，導致後續同步代碼（如 confirm()、loadTree()）先執行，造成全域變數尚未賦值即被使用。

控制 JS 執行順序對策

• setTimeout(fn, delay)：延遲執行，讓事件迴圈處理完畢。
• Promise/async-await：現代語法將非同步流程線性化，避免回調地獄。
• 將依賴 AJAX 資料的邏輯移入 success 回調或 .then() 中。

最佳實踐建議

1. 盡量減少內嵌 Scriptlet，採用 MVC 分離關注點。
2. JS 檔案外部化，利用建構工具打包壓縮。
3. 非同步操作統一用 Promise 管理，避免順序競爭。