V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
NonClockworkChen
V2EX  ›  问与答

dom 里面也用到了观察者模式?

  •  
  •   NonClockworkChen · 2019-04-03 22:23:39 +08:00 · 1649 次点击
    这是一个创建于 1850 天前的主题,其中的信息可能已经有所发展或是发生改变。
    比如 html 里面写一个 input 标签,value 是‘ 1 ’
    然后用 getElementsByTagName('input')[0]拿到 input 之后,修改 input 的 value 为‘ 2 ’。
    那么浏览器就渲染 input 为 2.

    这个过程是观察者模式吗
    11 条回复    2019-04-04 20:47:09 +08:00
    noe132
        1
    noe132  
       2019-04-04 02:15:44 +08:00 via Android
    你可以这么理解。+(只不过具体实现复杂很多。
    geelaw
        2
    geelaw  
       2019-04-04 06:27:43 +08:00 via iPhone
    一个过程并不是一个模式,只能说它的实现是不是用了某个模式。几乎所有现代的事件系统都是观察者模式实现的——这是一个很自然的模式(我甚至之前都不知道这还有个名字)。你可以认为 set_input 通知了浏览器的渲染引擎自己的变化。
    Mutoo
        3
    Mutoo  
       2019-04-04 06:27:44 +08:00   ❤️ 3
    这种地方通常不会用到观察者模式,一般作法是脏检测。value 改变的时候,将该元素及所有祖先标记为脏,一帧过后,将所有标记为脏的结点全部重绘。
    qping
        4
    qping  
       2019-04-04 09:08:53 +08:00
    @Mutoo #3 所有祖先也需要标记吗
    karllynn
        5
    karllynn  
       2019-04-04 10:42:02 +08:00
    这个要看浏览器是怎么实现的…

    你不要把一种现象和一种设计模式直接关联起来…这有无数种可能
    Mutoo
        6
    Mutoo  
       2019-04-04 10:53:57 +08:00
    @qping 纠正一下,应该是用脏矩形,将相交的元素标记为待更新。细节可以参阅一下《 Webkit 技术内幕》一书。
    NonClockworkChen
        7
    NonClockworkChen  
    OP
       2019-04-04 10:57:02 +08:00
    @Mutoo 谢谢,之前朋友圈里还有人专门花 2 倍钱,买了这本书的二手。
    qping
        8
    qping  
       2019-04-04 11:03:01 +08:00
    @Mutoo #6 谢谢~
    qping
        9
    qping  
       2019-04-04 11:04:43 +08:00
    @Mutoo 这书真是贵啊 还没货
    lizhuoli
        10
    lizhuoli  
       2019-04-04 20:41:35 +08:00 via iPhone
    @Mutoo 其实这就是观察者模式的标准实现,通过更改的地方触发一个标记或者通知……
    Mutoo
        11
    Mutoo  
       2019-04-04 20:47:09 +08:00   ❤️ 1
    @lizhuoli 观察者模式的实现是订阅 /发布,或者说推送( push ),而这个是轮询( pull )怎么能一样。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   1710 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 16:57 · PVG 00:57 · LAX 09:57 · JFK 12:57
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.