慕虎7371278
2023-05-19 17:07:45
在我的應(yīng)用程序中,我有大約 10 個不同的頁面,其中大部分使用某種 JavaScript。app.js目前,我有一個包含在所有頁面中的客戶端文件。為了弄清楚要在頁面上附加哪些事件偵聽器,我基本上檢查url位置并從那里開始:window.onload = function () { let urlLocation = window.location.pathname.split('/')[1] //Global functionality for all pages UIctrl.toggleActiveNavbar(urlLocation) //createTopic route if (urlLocation === 'createTopic' || urlLocation === 'edit') { UIctrl.createTopicTagsBasedOnCategory() UIctrl.handleCreateOrEditTopicClick() } if (urlLocation === 'editPost' || urlLocation === 'createPost') { UIctrl.handleCreateOrEditPostClick() } // .... and so on }盡管它有效,但我認為這不是一個好方法。如果一個項目變得足夠大,就很難管理它。我無法找到如何正確執(zhí)行此操作的答案。我的問題是:我應(yīng)該js為每一頁準備單獨的文件嗎?我的問題是我必須復(fù)制所有頁面上使用的通用代碼。您是否在您的 express 應(yīng)用程序中使用某種捆綁器(webpack/parcel)來解決這個問題?也許你可以指點我一個顯示如何正確設(shè)置它的存儲庫。這在現(xiàn)實世界的生產(chǎn)環(huán)境中是如何完成的?謝謝。
1 回答

肥皂起泡泡
TA貢獻1829條經(jīng)驗 獲得超6個贊
您的直覺是比較 URL 來決定要運行的初始化是一種糟糕的編碼方式是正確的。這不是一個好的模式,隨著越來越多的頁面和維護隨著時間的推移會變得非常痛苦,很快就會失去控制。
相反,您可以將公共代碼放在每個頁面都加載的共享 JS 文件中,以便可以根據(jù)需要使用這些功能。然后,在每個單獨的頁面內(nèi)使用內(nèi)聯(lián)<script>
標記來執(zhí)行特定于頁面的初始化,設(shè)置特定于該頁面的事件偵聽器并調(diào)用共享 JS 文件中的代碼。
如果對于某些頁面,您有很多頁面特定的初始化代碼,您可以只將這些頁面特定的代碼放在頁面特定的 JS 文件中,但通常您不希望每個頁面都有一個外部 JS 文件如果可以避免,請訪問您的頁面。嘗試將大部分代碼放在通用 JS 文件中,然后在每個特定頁面中只使用一小部分內(nèi)聯(lián)代碼來進行正確的初始化。這會將您的大部分代碼放在一個通用的共享 JS 文件中,并在特定頁面中保留特定于頁面的初始化邏輯。
每個頁面都應(yīng)該有單獨的 js 文件嗎?我的問題是我必須復(fù)制所有頁面上使用的通用代碼。
不。您不想在單獨的 JS 文件中復(fù)制大量代碼,因為那是維護的噩夢并且會破壞有效的瀏覽緩存。
添加回答
舉報
0/150
提交
取消