【知识梳理】4.5MVVM框架类

发布时间:2019-08-20 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了【知识梳理】4.5MVVM框架类脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

1.MVVM框架

MVVM
参考资料:教你认清MVC,MVP和MVVM三种模式

2.双向绑定的原理

双向绑定的原理
Object.defineProperty()作用:能监听data的变化,当有变化时会调用回调函数,回调函数中写好了viewdata的关系,所以后续只需修改data即可。
Object.definePRoPErty() 方法会直接在一个对象上定义一个新属性或者修改一个对象的现有属性, 并返回这个对象。

  • Object.defineProperty(obj, prop, descriptor)
  • obj:要在其上定义属性的对象。
  • prop:要定义或修改的属性的名称。
  • descriptor:将被定义或修改的属性描述符。
// 使用 __proto__
VAR obj = {};
var descriptor = Object.create(null); // 没有继承的属性
// 默认没有 enumerable,没有 configurable,没有 wrITable
descriptor.value = 'static';
Object.defineProperty(obj, 'key', descriptor);

// 显式
Object.defineProperty(obj, "key", {
  enumerable: false,
  configurable: false,
  writable: false,
  value: "static"
});
Object.defineProperty()与reflect.defineProperty()的区别:

Object.defineProperty()是es5中的用法,返回一个新对象;
reflect.defineProperty()是es6中的用法,返回一个布尔值;

参考资料:Object.defineProperties()

3.设计模式

观察者模式:

  • 0.:data,返回:view;
  • 1.监听者,observer,用于监听data发生变化(原理:object.defineProperty),并通知观察者列表;
  • 2.观察者列表,Dep,当监听到data发生变化时,会触发object.defineProperty中的set函数,set将循环一遍观察者列表,列表中每一个观察者对象都会调用自身的update回调,回调过程中会将数据更新到view中,;
  • 3.观察者,watcher,定义更新的内容update,往观察者列表中增加内容;

【知识梳理】4.5MVVM框架类

4.生命周期

  • 1.beforeCreated
  • 2.created
  • 3.beforemount
  • 4.mounted
  • 5.beforeUpdate
  • 6.updated
  • 7.beforedestory
  • 8.destoryed

【知识梳理】4.5MVVM框架类

脚本宝典总结

以上是脚本宝典为你收集整理的【知识梳理】4.5MVVM框架类全部内容,希望文章能够帮你解决【知识梳理】4.5MVVM框架类所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。