概述
MVC 是一種思想踢星，它會讓我們寫代碼時更加簡潔、高效紊遵、模塊化，了解這種方法對于前端程序員來說是很有必要的侥蒙。首先說明下 MVC 代表的含義：
- M ==> Model ==> 模型
- V ==> View ==> 視圖
- C ==> Controller ==> 控制器
MVC 各自作用
MVC 主要是按功能劃分模塊
view：js 代碼所操縱的視圖（HTML）暗膜，負(fù)責(zé)顯示給用戶和通知 controller（控制器）
-
Model：view（視圖）所需要的所有的數(shù)據(jù)操作,包括：
- 初始化數(shù)據(jù)
- 讀取數(shù)據(jù)
- 存入數(shù)據(jù)
負(fù)責(zé)和向 server（服務(wù)器）請求數(shù)據(jù)和響應(yīng) server（服務(wù)器）
controller：所有的邏輯操作，負(fù)責(zé)監(jiān)控和更新 view（視圖） + 調(diào)用和接收 model（數(shù)據(jù)）
MVC 使用技術(shù)點
-
立即執(zhí)行函數(shù)鞭衩，這里有所有的立即執(zhí)行函數(shù)的寫法学搜，但是這里推薦大家使用
!function(){}.call()立即執(zhí)行函數(shù)避免了我們是用全局變量，隔離作用域醋旦，從而達(dá)到了使用局部變量的目的
-
閉包
閉包就是如果一個函數(shù)使用了它范圍外的值恒水，那么這個函數(shù) + 這個變量就叫做閉包
閉包使得模塊之間可以進(jìn)行相互訪問。具體實現(xiàn)：
閉包 + 操作局部變量- 函數(shù) fn 中局部變量 obj 和 return 的函數(shù)構(gòu)成了閉包
- return 的函數(shù)便是接口饲齐，可以供外部調(diào)用钉凌，從而來操縱局部變量 obj
- 外部除了使用函數(shù) fn 的接口，沒有任何其他方法可以訪問到局部變量 obj
-
全局變量
模塊與模塊之間是在不同的 js 文件中捂人，例如模塊2想去操縱模塊1的數(shù)據(jù)御雕，通過上述方式顯然是不夠的，那么只能退而求其次滥搭，使用全局變量酸纲。具體實現(xiàn)：
全局變量
通過使用全局變量保存了匿名函數(shù)的地址，從而全局都可以使用這個全局屬性
總結(jié)
以上3種技術(shù)點的結(jié)合 ==> 立即執(zhí)行函數(shù) + 閉包 + 全局變量 實現(xiàn)了 MVC 中 Controller（控制器） 的相應(yīng)需求瑟匆，從而讓前端更好的使用 MVC 思想
細(xì)節(jié)問題
- this 的使用闽坡，在 MVC 中要著重使用 this
- 箭頭函數(shù)，其實在 MVC 中使用箭頭函數(shù)，主要就是為了 this 疾嗅，原因在于箭頭函數(shù)內(nèi)外 this 不變
- HTML 中每一塊都是一個 view 外厂，當(dāng)我們?yōu)?HTML 分塊的時候，是可以嵌套的代承，所以我們的 view 也是可以嵌套的
使用模板
!function(){
let view = 操縱的 HTML 模塊
let model = {
init: function(){},
fetch: function(){} // 注意此處最好返回 Promise 對象
save: function(){} // 注意此處最好返回 Promise 對象
}
let controller = {
view = null,
model = null,
...... = null,
init: function(){
this.view = view
this.model = model
......
this.bindEvents()
},
bindEvents: function(){
// 綁定事件汁蝶，與綁定事件無關(guān)的放在 controller 屬性上
},
......
}
controller.init( controller,model )
//controller.init.call( controller,view, model )
}.call()
