本文中的知识点，我也不是很懂，比较难理解。

涵子

什么是涵子

涵子是函数式编程里面最重要的数据类型，也是最基本的运算单位和功能单位。

它是一种范畴（也是一种容器），包含了值和变形关系。比较特殊的是，它的变形关系可以依次作用于每一个值，将当前容器变形为另一个容器。

上图中，左侧的圆圈就是一个汉字，表示人名的范畴。外部传入函数 f，会转成右边标示早餐的范畴。

函数式编程 Funtional programming

函数式编程是一种编程范式，也就和如何写程序的方法论，属于结构化编程的一中，主要思想是把运算过程尽量写成一系列嵌套的函数调用

学习函数式编程需要了解什么？

• 了解什么时候范畴论
• 数学模型和范畴之间的关系
• 范畴与函数式编程的关系

什么是范畴论？

函数式编程的起源，是一门叫范畴论（Caregory Theory）的数学分支

什么是闭包？

闭包就是能够读取其他函数内部变脸的函数。在 JavaScript 中，只有函数内部的子函数才能读取局部变量，所以闭包可以理解成「定义在一个函数内部的函数」。本质，闭包是将函数内部和函数外部连接起来的桥梁。

变量的作用域

要了解闭包，首先必须了解 JavaScript 特殊的变量作用域。

• 全局变量
• 局部变量

回收机制

JS 为了防止内存泄露，会执行回收机制

什么是内存泄漏？

当已经不需要某块内存时，内存却还存在。

所以，回收机制就是阶段性的不定期去寻找不再使用的变量，并释放他们所指向的内存

比如如何处理哪些已经执行完毕的函数，如果么有外部应用，则会回收。

常用的两种垃圾回收规则：

• 标记清除
• 引用计数

Javascript 引擎基础 GC 方案是（Simple GC）：

JS 的执行阶段

当解释器解释完语法规则后，就开始执行，然后整个执行流程中大致包含：

• 执行上下文，执行堆栈概念（如全局上下文，当前活动上下文）
• VO（变量对象）和 AO（活动对象）
• 作用域脸
• this 机制

执行上下文

• JS 有执行山下文
• 浏览器首次载入脚本，它将创建「全局执行上下文」，并亚压入执行栈栈顶（不可以被弹出）
• 然后每进入其他作用域就创建对应的执行上下文并把它压入执行栈的顶部
• 一旦对应的上下文执行完毕，就会从栈顶端弹出，并将上下文控制权交给当前的栈
• 依次进行，直至回到全局执行上下文

JS 引擎解析过程

什么是 JS 引擎？

JavaScript 解析引擎是为「读懂」JavaScript 代码，并准确地给出代码运行结果的一段程序。

举个栗子：

1

var a = 1 + 1;

JavaScript 引擎所做的事情就是看懂（解析）这段代码，并将 a 的值变成 2

JS 的解释阶段

JS 是解释型语言，所以它无需提前编译，而是由解释器实时运行的

上一篇忘了说明什么是格式上下文（FC）

FC

Formattinf Context,格式上下文。它定义了框内部的元素渲染规则，比较抽象。

FC 像是一个容器，里面内部包含元素。容器可以隔开里面的额元素和外面的元素，保护内部元素被外部元素影响。

注意，并不是说所有的框都产生 FC，而是符合特定条件才会产生，只有产生了对于的 FC 后才会应用对应渲染规则

CSS 的可视化格式模型

简介

• CSS 中规定每个元素都有自己的盒子模型
• 可视化格式模型则是把这些盒子按照规则摆放到页面上布局
• 盒子模型规定了怎么在页面上布局盒子和盒子之间的相互作用

CSS 的可视化格式模型规定了浏览器在页面中如何处理文档树

其中包括了

1
2
3
4
5
6

包含块（Containing Block)
控制框（Controlling Box）
BFC（Block Formatting Context）
IF（Inline Formatting Context）
定位体系
浮动

Chrome 中的调试

Chrome 的开发者工具中，Perfromance 中可以看到详细的渲染工程

资源外链的下载

在解析 html 时，会遇到一些资源链接，此时需要进行单独处理

一般情况，静态资源分为几个大类（未全列举）：

• CSS 样式资源
• JS 脚本资源
• img 图片资源

遇到外链时的处理

当遇到上述外链的时候，会独立开启一个下载线程去下载资源（HTTP1.1）

生成 CSS 规则

同理，CSS 规则树的生成也是类似

1

Bytes -> character -> tokens -> nodes -> CSSOM

1
2
3
4

1.Conversion：浏览器将获得的HTML内容（Bytes）基于他的编码转换为单个字符
2.Tokenizing分词：浏览器按照HTML规范标准将这些字符转换为不同的标记token。每个token都他有自己独特的含义以及规则及
3.Lexing词法分析：分词的结果是得到了堆的token，此时把他们的转换为对象，这些对象分别定义了他们的属性和规则
4.DOM构建：因为HTML标记定义的就是不同标签之间的关系，这个关系就像是一个树形结构。