MVC和代码优化

代码优化准则：

1. 尽量不使用var，因为会变量提升，不管怎样都容易不小心创建全局变量，建议改成使用let。
2. ES5里面只有函数有局部变量。那么使用function(){}.call()就可以产生局部变量了，但是函数不能是具名函数，因为具名函数会是一个全局函数。
   上述方法在chrome中会报错，于是想出来几种不报错的方法：
   1）加一个！号，!function(){}.call(),会改变函数的返回值，但是我们不在这个匿名函数的返回值，所以加个！没关系。
   2）（function(){}.call()）:不推荐，前面如果随便加上代码就会报错
   3）随机数，frank454564212315656.call(),不推荐，万一冲突了

MVC的代码模板

!function(){
  var view = document.querySelect('xxx') //操作的视图
  var model = {
    fetch:function(){}, //获取数据，返回Promise对象，可以直接在后面接.then
    save:function(){} // 存储数据，返回Promise对象，可以直接在后面接.then
  }
  var controller = {
    view: null, //默认为view
    model: null,
    init: function(view){
      this.view = view
      this.model = model
      this.bindEvents()
    },
    bindEvents: function(){
    //处理数据的一些操作
      this.model.fetch.then()
      this.model.save.then()
    }
  }
  controller.init(view)
}.call()

view：只操作看得见的东西
model：只操作跟数据相关的东西，请求和存储数据等
controller：控制器，控制其他的所有代码

MVC示意图