Backbone.js給出了一個Web應用程序的結構,它允許業(yè)務邏輯和用戶接口邏輯分開。在本章中,我們將討論Backbone.js的應用程序實現(xiàn)用戶界面的架構風格。下圖顯示了Backbone.js的架構:
Backbone.js的體系結構包括以下模塊:
HTTP客戶端發(fā)送一個HTTP請求消息的形式到服務器,其中網(wǎng)頁瀏覽器,搜索引擎等行為,如HTTP客戶端。 用戶請求的文件,如文檔,圖像等使用HTTP請求協(xié)議。在上面的圖中,你可以看到,HTTP客戶端使用路由器發(fā)送客戶端的請求。
它是用于路由客戶機端應用程序,并將它們連接到使用URL的動作和事件。它是應用程序對象的URL表示。該URL由用戶手動更改。 URL通過backbone使用,以便它可以理解應用程序的狀態(tài)來發(fā)送或呈現(xiàn)給用戶。路由器是一個機制能夠復制URL到達視圖。當Web應用程序提供可鏈接,可收藏,可共享的URL在應用程序中的重要位置,在路由器是必需的。
另外,在上述圖中,路由器發(fā)送HTTP請求到視圖。 這是當應用程序需要的路由能力有用的功能。
Backbone.js的視圖是負責從我們的應用程序如何并顯示什么,它們不包含HTML標記的應用。它指定數(shù)據(jù)模型呈現(xiàn)給用戶背后的作法。 視圖是用來反映“你的數(shù)據(jù)模型看起來像?”。該視圖類不知道HTML和CSS什么,每個視圖可更新當獨立的模型,而無需重新加載整個頁面的變化。它表示UI在DOM的邏輯塊。
如圖在上述架構中,視圖表示用戶界面,負責顯示用于通過使用路由器完成用戶請求的響應。
事件是一個應用程序的主要部分。它結合用戶的自定義事件到應用程序。它們可以被混合到任意對象,并能夠結合和觸發(fā)定制事件。您可以使用您所選擇的所需名稱綁定自定義事件。通常情況下,事件則與他們的程序流程同步處理。在上述架構,你可以看到,當一個事件發(fā)生時,它通過使用視圖表示模型的數(shù)據(jù)。
它是檢索和填充數(shù)據(jù)的JavaScript應用程序的核心。模型包含的數(shù)據(jù)的應用程序和邏輯的數(shù)據(jù)和表示在該框架基本數(shù)據(jù)對象。模型代表了一些業(yè)務邏輯和業(yè)務驗證業(yè)務實體。它主要用于數(shù)據(jù)存儲和業(yè)務邏輯。它可以從被檢索并保存到數(shù)據(jù)存儲。模型以從通過使用路由器的視圖傳遞的事件的HTTP請求,并從數(shù)據(jù)庫同步的數(shù)據(jù),并發(fā)送響應返回給客戶端。
集合是一組模型,其結合事件,當該模型已在集合中修改。集合包含可在循環(huán)被處理并支持排序和過濾模式列表。 當創(chuàng)建一個集合,我們可以定義模型的集合將不得不隨著屬性的實例類型。在模型上,這也將在模型集合觸發(fā)任何事件觸發(fā)。
它也需要從視圖,綁定事件請求和數(shù)據(jù)與請求的數(shù)據(jù)同步并發(fā)送響應返回給HTTP客戶端。
它是建立一個數(shù)據(jù)庫從服務器連接,并包含了從客戶端請求的信息。Backbone.js體系結構的流程可以被描述為示出在下面的步驟:
用戶請求使用路由數(shù)據(jù),該數(shù)據(jù)的路由應用程序使用URL的事件。
該視圖表示模型的數(shù)據(jù)給用戶。
模型和集合檢索和通過結合自定義事件填充使用從數(shù)據(jù)庫獲取的數(shù)據(jù)。