课程亮点

• 收获超过 20 种常见 JS 设计模式的提炼及实现过程；
• 理清不同 JS 设计模式之间的区别、联系和适用场景；
• 深入理解 JS 设计模式的核心思想和基本理念；
• 掌握在具体场景下抽象 JS 设计模式的能力；
• 在提炼和复盘中吸收经验，开拓视野，提升眼界。

课程介绍

随着前端技术的发展越来越快，前端科技树越点越深，TC39 委员会在不断审议各种提案，ECMAScript 标准每年推出新的语言规范，浏览器的版本在不断迭代推进新的技术方案，新的业务落地场景在不断兴起，前端开发者们随着技术的不断更迭，必须不断学习新技术、新工具、新框架。

框架常变，但不变的是框架的设计。 掌握框架设计模式，正是以不变应万变的根基，也是在前端飞速发展多变里的一点永恒。用的编程语言虽然不一样，但设计方法是类似的；用的框架虽然不一样，但设计模式是类似的。学习设计模式可以了解多变框架背后不变的部分，掌握框架的本质与设计思想，让软件设计能力得到快速提升，从而能够指导编写一段健壮的代码、一个复杂的需求、一个可维护性高的系统、一个优秀的软件架构，在学习工作中事半功倍。

掌握 JavaScript 设计模式是迈向高级前端开发者的必备技能，也是软件设计的基础。若想有长远的发展进阶，须夯实这座地基。JavaScript 从一开始简单的表单验证作用，发展到如今的大前端应用，复杂的业务场景对前端开发者提出了更高的设计要求，已不仅仅是简单的功能实现需求。JS 设计模式在面试中出现的频率也越来越高，特别是需要三年及三年以上工作经验的前端岗位，会对软件设计能力进行着重考察。如果你希望成为项目的技术负责人，那么具备软件的设计与分层能力，则是能够成为一名项目负责人的基础。

讲师 SHERlocked93，资深前端工程师，开源社区活跃贡献者，技术公众号《前端下午茶》运营者，擅长 Vue 技术栈。现任大型国企前端团队负责人，主要负责前端技术预研、工程框架搭建、基础设施建设等工作。

根据专栏课程风格，每篇 JS 设计模式的文章结构大致如下：

1. 引入：从一个生活的具体场景引入该设计模式以加深理解；
2. 实现：基于具体场景讲解代码实现、优化方向和优化过程；
3. 分析：分析模式的结构图、关键点、优缺点与适用场景；
4. 总结：总结与其它模式之间的关联与区别。

希望本期专栏可以帮助大家更好地学习 JavaScript 设计模式，同时更欢迎大家踊跃留言，共同讨论。

专栏模块

本专栏由浅入深，讲解由 JavaScript 的基础开始，到传统设计模式在 JavaScript 中的实现。除传统设计模式外，也会为大家讲解其它常用的前端设计模式。主要分为四个模块：

基础篇

this、闭包与高阶函数、面向对象风格相关的继承等 JavaScript 设计模式前置知识的学习，为后续学习做良好铺垫。

创建型模式

学习如何创建对象，主要为将对象的创建和使用分离，通过抽象对象的实例化过程来帮助创建对象实例。内容包括单例模式、工厂模式、抽象工厂模式、建造者模式。

结构型模式

学习将对象按布局组成更大的结构。内容包括代理模式、享元模式、适配器模式、装饰者模式、外观模式、组合模式、桥接模式。

行为型模式

学习对象之间的通信，以及描述对象之间如何相互协作与分配职责。内容包括发布 - 订阅模式、策略模式、状态模式、模板方法模式、迭代器模式、命令模式、职责链模式、中介者模式。

其它模式

一些其它常用的前端设计模式，比如 MVC、MVP、MVVM、模块模式、链模式、中间件等。