前端设计模式应用 | 青训营笔记这是我参与「第四届青训营」笔记创作活动的的第7天。 JavaScript中的设计模式

这是我参与「第四届青训营」笔记创作活动的的第7天。

JavaScript中的设计模式

定义： 复制已有对象来创建新的对象 应用场景： JS中对象创建的基本模式 image (1).png image (2).png

定义： 可自定义控制原对象的访问方式，并且允许在更新前后做一些额外处理。 应用场景： 监控、代理工具、前端框架实现等 image (3).png image (4).png image (5).png

定义： 在不显露数据类型的情况下访问集合中的数据。 应用场景： 数据结构中有多种数据类型、列表、树等，提供通用操作接口。 image (6).png 用for of 迭代所有组件

image (7).png

image (8).png

image (9).png

前端框架中对DOM操作的代理前端框架.png Dom更新后的钩子

image (10).png

定义： 可对多个对象组合使用，也可以对单个对象独立使用 应用场景： DOM\前端组件、文件目录

image (11).png

image (12).png