BackboneJS - 應用

---

---

BackboneJS 為 Web 應用提供了一種結構，允許分離業務邏輯和使用者介面邏輯。本章將討論 BackboneJS 應用的架構風格，用於實現使用者介面。下圖顯示了 BackboneJS 的架構：

BackboneJS 的架構包含以下模組：

• HTTP 請求
• 路由器
• 檢視
• 事件
• 模型
• 集合
• 資料來源

現在讓我們詳細討論所有模組。

HTTP 請求

HTTP 客戶端以請求訊息的形式向伺服器傳送 HTTP 請求，其中 Web 瀏覽器、搜尋引擎等充當 HTTP 客戶端。使用者使用 HTTP 請求協議請求檔案，例如文件、影像等。在上圖中，您可以看到 HTTP 客戶端使用路由器傳送客戶端請求。

路由器

它用於客戶端應用程式的路由，並使用 URL 將它們連線到操作和事件。它是應用程式物件的 URL 表示。此 URL 由使用者手動更改。Backbone 使用此 URL 來理解要傳送或呈現給使用者的應用程式狀態。

路由器是一種機制，可以複製 URL 以到達檢視。當 Web 應用程式為應用程式中的重要位置提供可連結、可新增書籤和可共享的 URL 時，需要路由器。

在上圖架構中，路由器將 HTTP 請求傳送到檢視。當應用程式需要路由功能時，這是一個有用的特性。

檢視

BackboneJS 檢視負責如何以及從我們的應用程式顯示什麼內容，它們不包含應用程式的 HTML 標記。它指定了將模型資料呈現給使用者的理念。檢視用於反映“你的資料模型是什麼樣的”。

檢視類對 HTML 和 CSS 一無所知，並且當模型更改時，每個檢視都可以獨立更新，而無需重新載入整個頁面。它代表 DOM 中 UI 的邏輯塊。

如上圖架構所示，檢視代表使用者介面，負責顯示使用路由器完成的使用者請求的響應。

事件

事件是任何應用程式的主要組成部分。它將使用者的自定義事件繫結到應用程式。它們可以混合到任何物件中，並且能夠繫結和觸發自定義事件。您可以使用您選擇的所需名稱來繫結自定義事件。

通常，事件與其程式流程同步處理。在上圖架構中，您可以看到當事件發生時，它使用檢視來表示模型的資料。

模型

它是 JavaScript 應用程式的核心，負責檢索和填充資料。模型包含應用程式的資料、資料的邏輯，並表示框架中的基本資料物件。

模型表示具有某些業務邏輯和業務驗證的業務實體。它們主要用於資料儲存和業務邏輯。模型可以從資料儲存中檢索並儲存到資料儲存中。模型從檢視透過路由器傳遞的事件接收 HTTP 請求，並同步資料庫中的資料並將響應傳送回客戶端。

集合

集合是一組模型，當集合中的模型被修改時，它會繫結事件。集合包含可以迴圈處理的模型列表，並支援排序和過濾。建立集合時，我們可以定義該集合將具有的模型型別以及屬性的例項。在模型上觸發的任何事件也會觸發模型中的集合。

它還接收來自檢視的請求，繫結事件並使用請求的資料同步資料，並將響應傳送回 HTTP 客戶端。

資料來源

它是從伺服器到資料庫的連線設定，包含客戶端請求的資訊。BackboneJS 架構的流程可以描述如下步驟：

• 使用者使用路由器請求資料，路由器使用 URL 將應用程式路由到事件。

• 檢視將模型資料呈現給使用者。

• 模型和集合透過繫結自定義事件來檢索和填充資料庫中的資料。

在下一章中，我們將瞭解事件在 BackboneJS 中的重要性。