資訊專欄INFORMATION COLUMN
摘要：描述的是的當(dāng)前狀態(tài)。持久化可以允許我們編輯和更新模型保存其最新狀態(tài)在內(nèi)存中用戶的數(shù)據(jù)存儲中或者與數(shù)據(jù)庫同步。引用到集合模型過濾所有被查看過的圖片過濾所有未被查看過的圖片視圖視圖是模型的可視化表示視圖是關(guān)于構(gòu)建和維護一個元素。
1. MVCjavascript三個非常重要的架構(gòu)模式:
MVC(模型-視圖-控制器) backbone
MVP(模型-視圖-表示器)
MVVM(模型-視圖-視圖模型)
1.1 Model(模型)將業(yè)務(wù)數(shù)據(jù)(Model),用戶界面(View)隔離,(Controller)管理邏輯和用戶輸入
Model 代表特定于領(lǐng)域的數(shù)據(jù),不了解用戶界面(View(視圖),Controller(控制器)).當(dāng)一個Model(模型）改變時,它會通知它的觀察者。
View 描述的是Model的當(dāng)前狀態(tài)。Observer模式用于讓View了解Model什么時候更新或修改
Presentation由View關(guān)注,但不只是單個View(視圖)和Controller(控制器),屏幕上顯示的每個部分或者元素都需要View-Controller對。
Controller 在這個View-Controller對中的作用是處理用戶交互(如按鍵和點擊等動作),為View做決定。
使用Backbone實現(xiàn)的一個非常簡單的Model(模型)
var Photo = Backbone.Model.extend({
//photo的默認(rèn)屬性
defaults: {
src: "placeholder.jpg",
caption: "A default image",
viewed: false
},
//確保每個photo都有一個src
initialize: function(){
this.set({"src": this.defaults.src});
}
});
在實際應(yīng)用程序中使用Model(模型)時,我們一般也要求Model(模型）具持久化。持久化可以允許我們編輯和更新Model(模型),保存其最新狀態(tài)在內(nèi)存中、用戶的localStorage數(shù)據(jù)存儲中或者與數(shù)據(jù)庫同步。
一個Model(模型)可能有多個觀察它的View(視圖)。
在集合組(Backbone)里管理Model(模型）允許我們根據(jù)從組中收到的通知編寫應(yīng)用程序邏輯,該組中包含的所有Model(模型)都應(yīng)被改變。
var PhotoGallery = Backbone.Collection.extend({
//引用到集合模型
model: Photo,
//過濾所有被查看過的圖片
viewed: function(){
return this.filter(function(photo){
return photo.get("viewed");
});
},
//過濾所有未被查看過的圖片
unviewed: function(){
return this.without.apply(this, this.viewed());
}
});
1.2 View(視圖)
視圖是Model(模型)的可視化表示,JavascriptView視圖是關(guān)于構(gòu)建和維護一個DOM元素。1.3 Controller(控制器) 2. MVP 3. MVVM
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/78875.html
摘要：當(dāng)前有超過個框架，但是其中很多沒有使用。扮演了的角色，使用處理用戶輸入同時檢索數(shù)據(jù)為數(shù)據(jù)格式化，用于展現(xiàn)類似，提供了和之間的數(shù)據(jù)綁定借鑒了其他模式，沒有特定的名稱。 https://speakerdeck.com/addyosmani/digesting-javascript-mvc 這里看了一個關(guān)于js mvc框架的ppt，作者是一位google的工程師，感覺挺全面挺有意思，適合像我...
摘要：首先我們要大概搞清楚一些什么模式。什么模式是等的一個統(tǒng)稱，它們各有不同，但本質(zhì)上其實是一個東西。不關(guān)心它會被如何顯示或是如何被操作。效果圖如下，我們只關(guān)心功能實現(xiàn)，所以樣式丑我們先忍一下。 假如讓你不依托任何前端框架（React/Vue/Angular等等），單純用Javascript編寫一個網(wǎng)站應(yīng)用，你還知道怎么開發(fā)嗎？ 舉個例子，產(chǎn)品經(jīng)理讓你實現(xiàn)一個網(wǎng)頁，上面有一張貓咪的圖片，貓咪...
摘要：如何同步的變更。在沒有環(huán)境下對進行單元測試的時候，業(yè)務(wù)邏輯的正確性是無法驗證的更新的時候，無法對的更新操作進行斷言。對是通過接口進行，在對進行不依賴環(huán)境的單元測試的時候。這里根據(jù)上面的例子給出了的單元測試樣例。 前言 做客戶端開發(fā)、前端開發(fā)對MVC、MVP、MVVM這些名詞不了解也應(yīng)該大致聽過，都是為了解決圖形界面應(yīng)用程序復(fù)雜性管理問題而產(chǎn)生的應(yīng)用架構(gòu)模式。 網(wǎng)上很多文章關(guān)于這方面的討...
閱讀 1310·2021-11-24 09:39
閱讀 473·2019-08-30 14:12
閱讀 2679·2019-08-30 13:10
閱讀 2505·2019-08-30 12:44
閱讀 1023·2019-08-29 16:31
閱讀 940·2019-08-29 13:10
閱讀 2527·2019-08-27 10:57
閱讀 3219·2019-08-26 13:57
