[發明專利]一種基于對象技術構建web前端應用的裝置及方法

在審

• 申請號: 202211056434.4
• 申請日: 2022-08-31
• 公開（公告）號: CN116149648A
• 公開（公告）日: 2023-05-23
• 發明（設計）人: 楊宇彤
• 申請（專利權）人: 成都索驥科技有限公司
• 主分類號: G06F8/38
• 分類號: G06F8/38;G06F16/958
• 代理公司: 成都金英專利代理事務所(普通合伙) 51218
• 代理人: 郭肖凌

本發明公開了一種基于對象技術構建web前端應用的裝置及方法，屬互聯網技術領域，解決了構建web前端應用現有技術中傳統原生方式的HTML、CSS、JavaScript分離導致的學習成本高；組件方式的運行時組件間數據訪問困難，組件復用時公共基礎代碼不穩定，存在冗余代碼，組件方式的實現與傳統原生方式相差大帶來代碼理解、移植和調試困難的技術問題。它包括主應用基類、頁面視圖基類、存儲基類、事件基類、加載和打包工具基類，將公共、基礎的功能封裝在上述的基類中，而web應用所需的具體頁面、功能相關代碼由各自的派生類來實現。本發明構建方便快捷，學習成本低，克服了現有組件方式公共基礎代碼不穩定、具有冗余代碼的問題，降低了組件間互訪問、操作的復雜度。

技術領域

本發明涉及一種構建web前端應用的裝置及方法，具體涉及一種基于對象技術構建web前端應用的裝置及方法，屬于互聯網技術領域。

背景技術

近年來隨著web前端技術的發展，各種基于HTML、CSS、JavaScript三項基礎技術的前端應用迅速發展，其無論在PC網頁前端應用、PC桌面前端應用還是手機移動領域都得到了大量的實踐。

構建web前端應用，傳統原生方式是將HTML、CSS、JavaScript分別定義在不同文件，這種HTML、CSS資源定義與JavaScript業務邏輯代碼相互分離的方式給web前端應用開發帶來了不少學習成本。

為改善這一缺點，近年來出現的基于組件技術的前端框架，比如：?React、Angular，它們將web應用按照功能拆分為獨立的組件，并將上述HTML、CSS、JavaScript三個文件分割為小的片段組織進了這些組件的實現代碼中，這種方式將HTML、CSS資源定義與JavaScript業務邏輯代碼中與該組件相關的代碼組合在一起，方便了開發者理解組件的實現邏輯降低了學習成本。但這樣的組織方式會因為各個組件相對獨立，其在運行時組件間的數據訪問變得困難；另外，如果需要重用該組件，只能復制該組件所有HTML、CSS、JavaScript代碼并在這些代碼基礎上進行修改，這種復用方式很不利于組件的“公共、基礎”代碼的穩定，同時因為耦合太多又導致復用時不得不保留一些“冗余無用”的代碼。

上述框架為了保證組件封裝性，還采用了虛擬DOM方式來替代傳統的HTML顯式定義的DOM，這種表面具有技術先進性的做法雖然提高了組件封裝性，但也使得這些組件與傳統的基于DOM開發的代碼相差較大帶來代碼理解、移植上和調試上的困難。

上述的缺點直接導致了采用傳統原生方式和組件方式構建web前端應用時學習、使用成本都較高。

本申請人發現現有技術至少存在以下技術問題：

1、現有技術中，構建web前端應用的傳統原生方式因將HTML、CSS、JavaScript分別定義在不同文件而帶來的資源定義代碼與業務邏輯代碼相互分離而不便于理解和學習成本較高的問題；

2、現有技術中，基于組件技術的前端框架在運行時組件間的數據訪問較為困難；

3、現有技術中，基于組件技術的前端框架組件復用方式不利于組件的“公共、基礎”代碼的穩定，同時因為耦合太多又導致復用時不得不保留一些“冗余無用”的代碼；

4、現有技術中，基于組件技術的前端框架為了保證組件封裝性，采用了虛擬DOM方式來替代傳統的HTML顯式定義的DOM，使得這些組件與傳統的基于DOM開發的代碼相差較大帶來代碼理解、移植上和調試上的困難，增加了學習、使用成本。

發明內容