这是我参与「第四届青训营 」笔记创作活动的第3天
本堂课重点内容
基于面向的设计模式在前端中的应用场景
详细知识点介绍
设计模式——软件开发中常见问题的解决方案模型
23种设计模型
- 创建型-如何创建一个对象
- 结构型-如何灵活将对象组装成一个大的结构
- 行为型-负责对象间的高效通信和职责划分
- 浏览器模式
- 单例模式：全局唯一访问对象。
其他场景对对象的使用和改变是共用的。使用场景：缓存、全局状态管理
- 发布订阅模式
在被订阅者发生变化时通知订阅者
- JavaScript中设计模式
- 原型模式：复制一个baseuser创建一个新的user
- 代理模式：可自定义控制对原对象的访问方式，并且允许在更新前后做一些额外处理
- 迭代器模式：在不暴露数据结构条件下访问集合中数据，提供通用数据接口
- 前端框架中的设计模式
- 代理模式
- 组合模式：可多个对象组合使用，可也单个对象独立使用
Web 标准与前端开发
前端开发:起源、架构、变迁
前端应用领域
- To business：用于商业
- To customer：服务于消费者的平台
- To developer：协助开发者的工具
服务端的开发
- Node.js
- Express
- Koa
- Deno
前端开发:语言、框架、工具
- HTML、CSS、JavaScript、Webassembly、TS
- Node.js、Express、Koa、VUE、React
- Electron、Babel、git、Webpack、esbuild
后续自学资料
前端开发:浏览器、网络、服务器
- 深入理解现代浏览器
- An overview of HTTP
developer.mozilla.org/en-US/docs/…
前端学习路线
- Frontend Developer
web标准
-
W3C
- 官网：www.w3.org
- Github：github.com/w3c
- 规范查询：www.w3.org/TR
- 全球会员：www.w3.org/Consortium/…
- 中国会员：www.chinaw3c.org/china-membe…
- 标准流程：www.w3.org/2020/Proces…
- 研讨会：www.w3.org/participate…
-
Ecma TC39
- 官网：www.ecma-international.org
- TC39：tc39.es
- Github：github.com/tc39
- Discourse：es.discourse.group
- AM会员：www.ecma-international.org/about-ecma/…
- Contributing to ECMAScript：github.com/tc39/ecma26…
- 各TC会议日程：www.ecma-international.org/about-ecma/…
-
WHATWG
- 官网：whatwg.org/
- Github：github.com/whatwg
- 规范查询：spec.whatwg.org/
-
IETF
- 官网：www.ietf.org/
- Github：github.com/ietf
课后个人总结
设计模式（Design Pattern）是前辈们对代码开发经验的总结，是解决特定问题的一系列套路
设计模式三大类
- 创建型模式（Creational Pattern）： 对类的实例化过程进行了抽象，能够将软件模块中对象的创建和对象的使用分离。
（5种）工厂模式、抽象工厂模式、单例模式、建造者模式、原型模式
- 结构型模式（Structural Pattern） ：关注于对象的组成以及对象之间的依赖关系，描述如何将类或者对象结合在一起形成更大的结构，就像搭积木，可以通过简单积木的组合形成复杂的、功能更为强大的结构。
（7种）适配器模式、装饰者模式、代理模式、外观模式、桥接模式、组合模式、享元模式
- 行为型模式（Behavioral Pattern） ：关注于对象的行为问题，是对在不同的对象之间划分责任和算法的抽象化；不仅仅关注类和对象的结构，而且重点关注它们之间的相互作用。
（11种）策略模式、模板方法模式、观察者模式、迭代器模式、责任链模式、命令模式、备忘录模式、状态模式、访问者模式、中介者模式、解释器模式
