当前位置:首页 » 操作系统 » vuejs源码分析

vuejs源码分析

发布时间: 2023-07-14 20:20:37

⑴ vuejs源码用了什么设计模式,具体点的

最简单的订阅者模式

// Observer
class Observer {
constructor (data) {
this.walk(data)
}
walk (data) {
// 遍历
let keys = Object.keys(data)
for(let i = 0; i < keys.length; i++){
defineReactive(data, keys[i], data[keys[i]])
}
}
}

function defineReactive (data, key, val) {
observer(val)

// dep 为什么要在这里实例化, 就是为了实现, 对象每一层的 每一个key都有自己的一个订阅实例, 比如 a.b 对应 dep1, a.c 对应dep2, 这里虽然都是let dep = new Dep()
// 但每次来到这个方法, dep都是独立的, 会一直保留在内存. 这样在每次调用set方法都能找到这个a.b对应的dep
// dep 这里会一直保存, 是因为闭包的关系, Object这个全局的函数, 引用了上层的作用域, 这个作用域包含了 dep, 除非Object = null, 或者退出浏览器, dep才会消失

//实例化之后, dep就有了被订阅, 和发布消息的功能, dep不写在这里也是可以的, 多定义一个全局函数, 每次obser的时候增加一个dep
let dep = new Dep()
Object.defineProperty(data, key, {
enumerable: true,
configurable: true,
get: function () {
//每次new Watch('a.b'), 都会先执行get方法, 进而来到这里, 触发 dep.depend(), 这个dep就是 a.b 对应的 订阅,
dep.depend()
return val
},
set: function (newVal) {
if(val === newVal){
return

热点内容
蜗牛游戏安卓手机怎么更换账号 发布:2025-03-17 13:41:49 浏览:321
为什么人买一个苹果一个安卓 发布:2025-03-17 13:36:59 浏览:438
三星手机短信在那个文件夹 发布:2025-03-17 13:31:51 浏览:194
安卓皇帝隐藏剧情在哪里 发布:2025-03-17 13:18:53 浏览:507
新版安卓为什么不兼容 发布:2025-03-17 13:18:49 浏览:483
s3哪个配置性价比高 发布:2025-03-17 13:06:09 浏览:320
气体压缩能量 发布:2025-03-17 13:00:16 浏览:78
压缩油19 发布:2025-03-17 12:25:29 浏览:858
linux上网代理 发布:2025-03-17 12:23:56 浏览:361
c是高级语言吗 发布:2025-03-17 12:16:31 浏览:525