MVC和代码优化

2020-08-21  本文已影响0人  凉城十月
代码优化准则:
  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示意图
上一篇 下一篇

猜你喜欢

热点阅读