MVC

MVC(Model View Control)

MVC 是一种设计模式（或者软件架构），把系统分为三层：Model数据、View视图和Controller控制器。

1. Model 数据管理，包括数据逻辑、数据请求、数据存储等功能。前端 Model 主要负责 AJAX 请求或者 LocalStorage 存储
2. View 负责用户界面，前端 View 主要负责 HTML 渲染。
3. Controller 负责处理 View 的事件，并更新 Model；也负责监听 Model 的变化，并更新 View，Controller 控制其他的所有流程。

代码说明

var model = {
    data: null,
    init(){}
    fetch(){}
    save(){}
    update(){}
    delete(){}
}
view = {
    init() {}
    template: '<h1>hi</h1'>
}
controller = {
    view: null,
    model: null,
    init(view, model){
        this.view = view
        this.model = model
        this.bindEvents()
    }
    render(){
        this.view.querySelector('name').innerText = this.model.data.name
    },
    bindEvents(){}
}

MVC三部分可以有效将程序的不同功能进行职责分离，提高模块的兼容性和复用性。

ES6之前只有函数里有局部变量，不能直接用{}包起来，因为会变量提升，用函数包起来成为局部变量

如何使用立即执行函数

1. 我们不想要全局变量
2. 我们要使用局部变量
3. ES 5 里面，只有函数有局部变量
4. 于是我们声明一个 function xxx，然后 xxx.call()
5. 这个时候 xxx 是全局变量（全局函数）
6. 所以我们不能给这个函数名字
7. function(){}.call()
8. 但是 Chrome 报错，语法错误

9. 试出来一种方法可以不报错:

   1. !function(){}.call() (我们不在乎这个匿名函数的返回值，所以加个 ! 取反没关系)

   2. (function(){}).call() 不推荐

      xxx    
      (function(){}).call() 报错

      3.frank192837192463981273912873098127912378.call() 不推荐

闭包对数据隐藏细节，访问控制，
闭包要和立即执行函数一起用
箭头函数()=>{}内外,this不变
用户看的见的东西，这就是view
如果你是一个对象调用一个函数，

var controller={}
controller.init(view)==>controller.init.call(controller,view)

这个call里面this就是这个对象