前端咸菜

为什么需要Proxy？ Vue3的核心特征之一就是响应式，而实现数据响应式依赖于底层的Proxy。因此，想要完成Vue的响应式功能，首先需要理解Proxy。 以reactive为例，当想要创建一个响应

课本上的编译原理 任何编程语言是无法直接运行在机器上的，想要将我们编写的代码翻译为机器可以识别运行的代码，需要对编程语言进行“翻译”。

为什么要进行垃圾回收？ 在程序执行的过程中，当部分数据不再被需要，就成为了垃圾数据。如果不能及时有效的回收这些垃圾数据，就会造成内存泄漏，浪费系统内存，从而导致程序运行速度变慢，甚至引起系统崩溃。

代理模式的作用 被代理对象不能直接访问，需要通过代理。 标准代理模式 代理模式的应用 DOM事件代理 将事件绑定到父容器上 适合子元素数量不确定的场景（如图片瀑布流） 代码片段 Proxy语法

装饰器模式的作用 在不生成子类的前提下，给现有对象添加新功能。 标准装饰器模式 装饰器模式的应用 装饰器语法 面向切面编程 （AOP, Aspect Oriented Program） 业务与系统基础

迭代器模式的作用 遍历访问被封装的有序集合。 可使用for...of遍历 数组操作：解构、扩展运算符、Array.from 用于创建Map和Set 用于Promise.all Promise.race

观察者模式的作用 被动获取不确定何时发生的事件。常用于回调函数场景。 异步: setTimeout, setInterval, Promise Node.js: stream, readline, h

单例模式的作用 一个对象仅能被创建一次。该对象创建之后即被缓存，以供后续使用。 性能要求单例（如登录框） 功能要求单例（如Vuex） 标准单例模式

工厂模式是创建对象的方式。 利用“工厂”创建对象，而非手动创建对象。 标准工厂模式 工厂模式在Vue中的应用

每个故事都需要特定的故事背景才能更深入的体会，而本文讲述的故事，背景就是故事发生的地方——浏览器（Chrome）。

什么是闭包？ 观察这段代码，输出结果是什么呢？基于其他编程语言的经验，可能会想当然的认为，变量count是属于makeCounter()函数的一个局部变量

命令式与声明式 JavaScript本身同时支持命令式与声明式的编程，但二者所强调的内容是不同的。 命令式风格：强调怎么做，上例中明确对每个元素计算； 声明式风格：强调是什么，上例中创建了double

技巧三 过程抽象 例子 ToDo List HTML CSS JavaScript 这个需求是一个ToDo List，每点击完成一件事情，这个事件会在2秒后消失(1)。如果不加处理，用户在完成一件事后

技巧二 组件封装 例子 轮播图 组件是指Web页面上抽出来一个个包含模版(HTML)、功能（JS）和样式(CSS)的单元。好的组件具备封装性、正确性、扩展性、复用性。 第一版 HTML：无序列表结构实

技巧一 各司其责 例子 暗色模式 控制网页支持暗色模式切换，如何实现？ 版本一 HTML CSS JavaScript 第一版代码功能上实现了暗色模式，其中(1)直接使用了JS对CSS样式进行操作。

在页面中使用CSS 外链：传统开发，内容和样式的分离； 嵌入：组件式开发，关注点（组件相关）分离； 内联：UI组件库，少量样式修改； CSS是如何工作的 选择器 找到页面中的元素。选择方式有： 按照标

什么是前端工程师？ 使用web技术栈，解决多端的图形界面交互问题的工程师。前端工程师在保证基础功能的同时，应围绕功能，深入性能、安全性、兼容性和体验等领域。 上图展示了前端的基础技术栈，如今前端远远超