前端设计模式 | 青训营笔记

69 阅读2分钟

这是我参与第四届青训营笔记创作活动的第三天

前端设计模式

什么是设计模式?

   - 软件设计中常见问题的解决方案模型(与特定语言无关)

背景

  1.   第一次出现在《模式语言:城镇、建筑、建造》一书中(1977年)
    
  2.   《设计模式:可复用面向对象软件的基础》(适用比较传统的领域:java,c++   1994

趋势

设计模式——趋势.jpg

分类

 - 创建型——如何创建对象
 - 结构型——组装成结构
 - 行为型——高效通信and职责划分
 

浏览器中的设计模式

单例模式(创建型模式)

 全局唯一访问对象
 应用场景:缓存、全局状态管理

发布订阅模式

 一种订阅机制,可在被订阅对象发生变化时通知订阅者。
 应用场景:从系统构架之间的解析,到业务中一些实现模式,向邮件订阅,上线订阅等等,应用广泛
 

Javascript中的设计语言

原型模式

复制已有对象来创建新的对象(JS中对象创建的基本模式)

代理模式

可自定义控制对原对象的访问方式,并且允许在更新前后做一些额外处理。
应用场景:监控、代理工具、前端框架实现等等

迭代器模式

在不暴露数据类型的情况下访问集合中的数据
应用场景:数据结构中有多种数据类型,列表,树等,提供通用操作接口。

前端框架中的设计模式

代理模式

前端框架中对DOM操作的代理

前端框架对DOM操作的代理.jpg

组合模式

可多个对象组合使用,也可以单个对象独立使用
应用场景:DOM、前端组件、文件目录,部门

总结

今天的学习让我系统的了解了前端设计模式(在此之前从来没有听说过……),我会继续努力的。