Knockout JavaScript Library

Knockout 是一個 JavaScript 的程式庫，簡稱 KO ，Knockout 是基於 MVVM (Model-View-View Model) 的設計模式，主要是提供資料繫結 (data-binding) 的功能，讓 UI 與資料模型之間能夠自動地動態更新。

MVVM 設計模式將 Web Application 分成下列三個部分：

• Model
  模型是指 Web App處理的資料本身，與 UI 沒有任何關係，通常是伺服端資料庫儲存的資料，瀏覽器透過 Ajax 方式取得。
• View Model
  檢視模型是指 UI 上資料 (data) 與操作 (operations) 的部分，在 Web App 中是一個 JavaScript 物件，物件的屬性對應至 UI 上的資料，而物件的方法則是操作的部分。
• View
  檢視是檢視模型中可見的 (visible)、互動的部分，在 Web App 中是 HTML 文件，檢視顯示 View Model 的資訊，將命令傳送給 View Model ，並依據 View Model 的狀態更新顯示內容。

使用 KO 開發  Web App 時，我們通常會在前端(用戶端)撰寫 JavaScript 程式，做為 View Model，並設計  HTML 做為 View 的顯示，在 HTML 中使用 data-bind 屬性繫結 View Model。另一方面，後端(伺服端)則是以 Python 或 PHP 等提供資料庫存取的功能，接收或傳送Model 的 JSON 資料。

Knockout 中最重要的是物件「observable」，當 View Model 物件的屬性是 observable 物件時，KO 將自動提供雙向的資料繫結，在 KO 中有 3 種 observable：

• ko.observable
• ko.computed
• ko.observableArray

一般最常使用的是 ko.observable，提供最基本的資料繫結，適合單一個物件的繫結，而 ko.observableArray 則是多個物件的繫結，KO 用的是陣列方式處理物件集合。最後 ko.computed 則提供將 observable 物件計算出新的 observable 物件，例如姓氏是 ko.observable，而名子是另一個  ko.observable，我們則可以利用 ko.computed 計算出姓名。

有了 MVVM 和 observable 的概念，已經可以著手開發以 KO 為基礎的 Web App 了，剩下只是認識 KO 提供的語彙，所幸內容不多很容易快速上手。如果你常常開發 CRUD 類型的 Web App，可以考慮採用 Knockout 程式庫。

###