快速掌握前端必会的 7 种设计模式

编辑点评

系统讲解前端常用设计模式，涵盖原理与应用，助你提升代码质量与架构能力。

⭐ 编辑推荐

本课程深入浅出地讲解前端必会的7种设计模式，从原理到实践，助你成为更优秀的前端开发者。

✨ 课程亮点

课程目录

📁 第9章装饰器模式-Decorator现已是JS的标准语法，装饰器
    9-7装饰器模式的场景-讲义.pdf  [52.9 KB]
    9-12章总结-讲义.pdf  [40.7 KB]
    9-15扩展-AOP介绍.pdf  [87.1 KB]
    group.png  [734.1 KB]
    9-1章介绍-讲义.pdf  [29.6 KB]
    9-3装饰器模式介绍-讲义.pdf  [275.4 KB]
    9-10装饰器模式的场景-Angular和React-redux.mp4  [25.2 MB]
    ocean.png  [1.2 MB]
    9-11装饰器模式的场景-AOP面向切面编程.mp4  [94.2 MB]
    9-4什么是装饰器模式，它解决什么问题.mp4  [25.3 MB]
    9-5演示-讲义【资源精选‖更多关注：CunWorkNotes】.pdf  [66.8 KB]
    9-6装饰器模式的UML类图和代码演示.mp4  [36.5 MB]
    9-8装饰器模式的场景-装饰class.mp4  [42.4 MB]
    9-2章介绍.mp4  [5.8 MB]
    9-9装饰器模式的场景-装饰class方法.mp4  [61.1 MB]
📁 第3章设计原则-设计模式只是套路，设计原则是指导思想
    3-6Unix-Linux设计哲学-前辈们总结出来的经验【不易整理‖请关注：CunWorkNotes】.mp4  [47.8 MB]
    3-3设计原则-讲义.pdf  [6.6 MB]
    3-10章总结.mp4  [5.2 MB]
    3-2章介绍.pdf  [6.6 MB]
    3-5SOLID五大设计原则-软件设计和开发的参考标准.mp4  [92.4 MB]
    3-8介绍23种设计模式.mp4  [42.3 MB]
    3-1章介绍【不易整理‖请关注：CunWorkNotes】.mp4  [13.6 MB]
    3-4-设计原则-感性与理性.mp4  [70.0 MB]
    3-9介绍23种设计模式-讲义.pdf  [6.6 MB]
    3-11章总结-讲义.pdf  [6.6 MB]
    3-7UNIXLinux设计哲学-讲义.pdf  [6.6 MB]
📁 第7章迭代器模式-遍历数据不仅仅是for和forEach，还有I
    7-11迭代器模式的场景-迭代器在JS中的实际应用.mp4  [95.9 MB]
    7-15章总结.mp4  [6.3 MB]
    7-2章介绍.mp4  [7.0 MB]
    7-5迭代器模式-UML类图和代码演示-讲义【不易整理‖请关注：CunWorkNotes】.pdf  [81.3 KB]
    quark.jpg  [206.7 KB]
    7-8迭代器模式的场景-JS中的有序结有那些？.mp4  [28.2 MB]
    7-14章总结-讲义.pdf  [27.3 KB]
    7-4迭代器介绍-讲义.pdf  [44.8 KB]
    7-1章介绍-讲义【优质资源‖关注：CunWorkNotes 解锁】.pdf  [26.1 KB]
    7-10迭代器的场景-自定义简易迭代器.mp4  [26.6 MB]
    7-3普通for循环不是迭代器.mp4  [16.8 MB]
    7-6迭代器模式-UML类图和代码演示.mp4  [101.4 MB]
    7-9迭代器模式的场景-JS内置迭代器Symbol.iterat.mp4  [40.1 MB]
    7-12迭代器模式的场景-Generator生成器.mp4  [74.6 MB]
    7-7迭代器模式的场景-讲义.pdf  [57.8 KB]
    7-13迭代器模式的场景-使用Generator遍历DOM树.mp4  [31.4 MB]
📁 第5章单例模式-全局只允许有一个实例，多则出错（用TS语法实现更
    5-2章介绍-讲义.pdf  [27.1 KB]
    5-6单例模式的演示-讲义【不易整理‖请关注：CunWorkNotes】.pdf  [96.5 KB]
    5-3什么是单例模式，它解决什么问题.mp4  [46.1 MB]
    5-8章总结.mp4  [6.6 MB]
    5-1章介绍.mp4  [6.3 MB]
    5-5单例模式的演示-使用Javascript【优质资源‖关注：CunWorkNotes 解锁】.mp4  [50.5 MB]
    5-7单例模式的场景-登录框.mp4  [41.0 MB]
    5-9章总结-讲义【资源精选‖更多关注：CunWorkNotes】.pdf  [36.1 KB]
    more.png  [1.4 MB]
    5-4单例模式的演示-使用Typescript.mp4  [120.7 MB]
📁 第11章其他设计模式-虽然有些模式不常用，但其编程思路很常用ic
    11-4职责链模式-把一个流程分为多个步骤，链式执行.mp4  [28.2 MB]
    11-1章介绍-讲义【不易整理‖请关注：CunWorkNotes】.pdf  [6.6 MB]
    11-6策略模式-避免大量的if-else或switch-cas.mp4  [59.3 MB]
    11-7适配器模式-讲义.pdf  [6.6 MB]
    11-10章总结.mp4  [2.8 MB]
    11-3职责链模式-讲义.pdf  [6.6 MB]
    11-9章总结-讲义.pdf  [6.6 MB]
    11-12关于MVC和MVVM.mp4  [11.4 MB]
    11-8适配器模式-灵活转换数据格式.mp4  [23.2 MB]
    11-2章介绍.mp4  [3.1 MB]
    11-5策略模式-讲义【不易整理‖请关注：CunWorkNotes】.pdf  [6.6 MB]
    11-11MVC和MVVM-讲义【优质资源‖关注：CunWorkNotes 解锁】.pdf  [6.6 MB]
📁 第13章课程总结
    13-1课程总结【优质资源‖关注：CunWorkNotes 解锁】.mp4  [47.2 MB]
📁 第8章原型模式-原型和原型链是JS必备的基础知识，还扩展了JS对
    8-1章介绍-讲义.pdf  [25.4 KB]
    8-15对象属性描述符-ennumerable.mp4  [34.9 MB]
    8-7图解JS原型链.mp4  [68.0 MB]
    8-8原型模式的场景-讲义.pdf  [25.8 KB]
    8-3原型模式的介绍和演示-讲义【不易整理‖请关注：CunWorkNotes】.pdf  [57.1 KB]
    8-5JS原型的基础知识-prototype和proto.mp4  [81.4 MB]
    8-9原型模式的场景-Object.create.mp4  [19.5 MB]
    8-14-对象属性描述符-writable-对比Object.f【优质资源‖关注：CunWorkNotes 解锁】.mp4  [73.5 MB]
    8-6原型和原型链-讲义.pdf  [68.2 KB]
    8-13对象属性描述符-configurable.mp4  [21.5 MB]
    8-16扩展-如何遍历对象的Symbol属性.mp4  [18.0 MB]
    8-18章总结.mp4  [6.0 MB]
    8-10JS对象属性描述符-讲义.pdf  [78.5 KB]
    8-2章介绍.mp4  [10.0 MB]
    8-17章总结-讲义.pdf  [25.7 KB]
    8-4原型模式的介绍和演示【不易整理‖请关注：CunWorkNotes】.mp4  [26.5 MB]
    8-12对象属性描述符-value.mp4  [29.3 MB]
    8-11对象属性描述符-如何获取和设置.mp4  [40.7 MB]
📁 课件源码
    design-pattern-code-master.zip  [673.5 KB]
    design-pattern-wiki-master.zip  [4.6 MB]
📁 第6章观察者模式-前端（及其他UI编程）最常用的设计模式，工作必
    6-8-观察者模式的场景-各种异步回调函数.mp4  [109.1 MB]
    6-17章总结-讲义.pdf  [37.2 KB]
    6-16章总结.mp4  [7.5 MB]
    6-15组件销毁前off自定义事件.mp4  [42.2 MB]
    6-2章介绍-讲义.pdf  [28.4 KB]
    quark.jpg  [206.7 KB]
    6-10观察者模式的场景-讲义.pdf  [236.6 KB]
    6-5观察者模式代码演示和UML类图.mp4  [108.4 MB]
    6-3什么是观察者模式，它解决什么问题.mp4  [23.3 MB]
    6-14发布订阅模式的场景-postMessage通讯.mp4  [55.4 MB]
    6-4观察者模式-讲义.pdf  [159.6 KB]
    6-11观察者模式和发布订阅模式的区别.mp4  [20.9 MB]
    6-1章介绍.mp4  [9.0 MB]
    6-6观察者模式的场景-Vue组件生命周期.mp4  [50.5 MB]
    6-7-观察者模式的场景-Vuewatch.mp4  [108.7 MB]
    6-9-观察者模式的场景-MutationObserver.mp4  [57.4 MB]
    6-12vs发布订阅模式-讲义.pdf  [138.0 KB]
    6-13发布订阅模式的场景-自定义事件-Vue3推荐使用mitt.mp4  [80.9 MB]
📁 第12章实战演练-看两个面试真题，体会一下设计模式的价值
    12-6面试题-停车场【整理不易‖记得关注：CunWorkNotes】.pdf  [325.4 KB]
    12-4面试题-打车【更多精选‖公众号：CunWorkNotes 获取】.pdf  [118.5 KB]
    12-3打车面试题-题目解读和分析.mp4  [33.8 MB]
    12-9停车场面试题-UML类图.mp4  [121.7 MB]
    12-5打车面试题-代码演示和UML类图.mp4  [72.8 MB]
    12-8停车场面试题-代码演示.mp4  [109.5 MB]
    12-11章总结-讲义.pdf  [23.0 KB]
    12-7停车场面试题-题目解读和分析.mp4  [35.5 MB]
    12-1章介绍-讲义.pdf  [30.3 KB]
📁 第4章工厂模式-封装实例的创建过程，解放VueReact内部都在
    4-5工厂模式代码演示和UML类图-简易版本.mp4  [84.8 MB]
    4-1章介绍.mp4  [7.9 MB]
    4-4什么是工厂模式，它主要解决什么问题【整理不易‖记得关注：CunWorkNotes】.mp4  [44.9 MB]
    4-11章总结.mp4  [14.1 MB]
    4-8工厂模式的场景-jQuery.mp4  [180.7 MB]
    4-12章总结-讲义【整理不易‖记得关注：CunWorkNotes】.pdf  [33.8 KB]
    4-2章介绍-讲义【资源精选‖更多关注：CunWorkNotes】.pdf  [30.6 KB]
    4-9工厂模式的场景-Vue和React的createEleme.mp4  [62.5 MB]
    4-3工厂模式介绍-讲义【资源精选‖更多关注：CunWorkNotes】.pdf  [52.6 KB]
    4-7演示-讲义.pdf  [151.7 KB]
    4-10场景-讲义.pdf  [75.3 KB]
    4-6工厂模式代码演示和UML类图-标准版本.mp4  [84.5 MB]
📁 第10章代理模式-无论开发环境还是线上环境，编程处处有代理icl
    10-3什么是代理模式-讲义.pdf  [47.3 KB]
    10-4什么是代理模式，它解决了什么问题.mp4  [6.0 MB]
    10-15Proxy的注意事项-讲义.pdf  [43.7 KB]
    10-5代理模式的UML类图和代码演示-讲义.pdf  [70.8 KB]
    10-11Proxy的使用场景-讲义.pdf  [53.2 KB]
    10-10代理模式的场景-Nginx反向代理.mp4  [45.3 MB]
    10-9代理模式的场景-webpack-dev-server的代.mp4  [56.6 MB]
    10-6代理模式的UML类图和代码演示.mp4  [67.9 MB]
    10-2章介绍.mp4  [4.0 MB]
    10-13Proxy语法会用于哪些地方？.mp4  [85.1 MB]
    10-17章总结.mp4  [4.9 MB]
    10-7代理模式的场景-讲义.pdf  [65.1 KB]
    10-1章介绍-讲义【更多精选‖公众号：CunWorkNotes 获取】.pdf  [26.4 KB]
    10-8代理模式的场景-DOM事件代理【整理不易‖记得关注：CunWorkNotes】.mp4  [54.3 MB]
    10-12Proxy语法-模拟明星经纪人示例.mp4  [82.8 MB]
    10-14Proxy可能会遇到的坑.mp4  [33.0 MB]
    10-16章总结-讲义.pdf  [24.2 KB]
📁 第1章课程介绍
    1-2-下载课程源代码和电子书.mp4  [83.8 MB]
    1-1导学.mp4  [25.2 MB]
📁 第2章面向对象OOP和UML类图-前端开发的必备编程思想
    2-2章介绍-讲义.pdf  [6.6 MB]
    2-5Typescript基础类型.mp4  [79.6 MB]
    2-7面向对象-前端主流的编程思想.mp4  [28.9 MB]
    2-11Vue和React组件也是对象.mp4  [22.4 MB]
    2-12UML类图.pdf  [6.9 MB]
    2-1章介绍.mp4  [20.5 MB]
    2-4TS简介-讲义.pdf  [6.6 MB]
    2-6Typescript自定义类型和interface.mp4  [60.1 MB]
    2-16章总结.mp4  [8.1 MB]
    2-17章总结-讲义.pdf  [6.6 MB]
    2-9面向对象重要概念-类和实例【资源精选‖更多关注：CunWorkNotes】.mp4  [49.3 MB]
    2-10面向对象三要素-继承，封装，多态.mp4  [129.6 MB]
    2-15UML类图-关联关系的细化.mp4  [25.0 MB]
    2-3Typescript介绍-前端最热门的编程语言.mp4  [61.0 MB]
    2-13UML类图-单个类.mp4  [96.2 MB]
    2-8什么是面向对象-讲义.pdf  [6.6 MB]
    2-14UML类图-类之间的关系【优质资源‖关注：CunWorkNotes 解锁】.mp4  [114.8 MB]

适合人群

• 前端开发者
• 希望提升代码能力的工程师

🎯 学习收获

• 掌握前端设计模式
• 提升代码可维护性
• 增强系统架构能力

🎉 祝您学习愉快！