为什需要构建知识体系？
    我们大脑对新知识的记忆总是依赖于旧有的认知，如果我们大脑中储备的知识都是杂乱无章的，那么我们在掌握新知识的时候，大脑总是无法迅速联想到旧有知识，造成对新知识的遗忘变得很快
    就像一间屋子，堆放了各种物品，当你要找一个东西时发现屋子里零零碎碎什么都有，没有办法快速找到所需要的东西，这时我们需要建立自己的知识体系，当有新知识时，放到合适的位置，方便提取和记忆
    构建自己的知识体系，就是就是把一些零碎的，分散的，相对独立的知识概念或者观点加以整合，使之形成具有一定联系的知识系统**

    winter大大的思维导图 构建自己的前端知识体系 - 图1名词解释：

    其他思维导图参考

    工程.jpg浏览器.pngcss.pngjs.png
    学习任何一门语言都要从语法和语义开始，那么他们到底是什么呢？
    词法分析（Lexical analysis或Scanning）和词法分析程序（Lexical analyzer或Scanner）
    　　词法分析阶段是编译过程的第一个阶段。这个阶段的任务是从左到右一个字符一个字符地读入源程序，即对构成源程序的字符流进行扫描然后根据构词规则识别单词(也称单词符号或符号)。词法分析程序实现这个任务。词法分析程序可以使用lex等工具自动生成。

    语法分析（Syntax analysis或Parsing）和语法分析程序（Parser）
    　　语法分析是编译过程的一个逻辑阶段。语法分析的任务是在词法分析的基础上将单词序列组合成各类语法短语，如“程序”，“语句”，“表达式”等等.语法分析程序判断源程序在结构上是否正确.源程序的结构由上下文无关文法描述.

    语义分析（Syntax analysis）
    　　语义分析是编译过程的一个逻辑阶段. 语义分析的任务是对结构上正确的源程序进行上下文有关性质的审查, 进行类型审查.例如一个C程序片断:
    　　int arr[2],b;
    　　b = arr * 10;
    　　源程序的结构是正确的.
    　　语义分析将审查类型并报告错误:不能在表达式中使用一个数组变量,赋值语句的右端和左端的类型不匹配.

    Lex
    　　一个词法分析程序的自动生成工具。它输入描述构词规则的一系列正规式,然后构建有穷自动机和这个有穷自动机的一个驱动程序,进而生成一个词法分析程序.

    Yacc
    　　一个语法分析程序的自动生成工具。它接受语言的文法,构造一个LALR(1)分析程序.因为它采用语法制导翻译的思想,还可以接受用C语言描述的语义动作,从而构造一个编译程序. Yacc 是 Yet another compiler compiler的缩写.

    源语言（Source language）和源程序（Source program）
    　　被编译程序翻译的程序称为源程序,书写该程序的语言称为源语言.
    目标语言（Object language or Target language）和目标程序（Object program or Target program）
    　　编译程序翻译源程序而得到的结果程序称为目标程序, 书写该程序的语言称为目标语言.
    中间语言（中间表示）（Intermediate language(representation)）
    　　在进行了语法分析和语义分析阶段的工作之后，有的编译程序将源程序变成一种内部表示形式，这种内部表示形式叫做中间语言或中间表示或中间代码。所谓“中间代码”是一种结构简单、含义明确的记号系统，这种记号系统复杂性介于源程序语言和机器语言之间，容易将它翻译成目标代码。另外，还可以在中间代码一级进行与机器无关的优化。

    文法（Grammars）
    　　文法是用于描述语言的语法结构的形式规则。文法G定义为四元组(，，，)。其中为非终结符号(或语法实体，或变量)集；为终结符号集；为产生式(也称规则)的集合；产生式(规则)是形如或 a ::=b 的(a , b)有序对,其中(∪)且至少含有一个非终结符，而(∪)。，和是非空有穷集。称作识别符号或开始符号，它是一个非终结符，至少要在一条规则中作为左部出现。
    　　一个文法的例子: G=(={A，R},={0,1} ，={A?0R，A?01,R?A1},=A)

    文法分类（A hierarchy of Grammars）
    　　著名语言学家Noam Chomsky定义了四类文法和四种形式语言类，文法的四种类型分别是0型、1型、2型和3型。几类文法的差别在于对产生式施加不同的限制，分别是：
    　　0型文法(短语结构文法)(phrase structure grammars)：
    　　设G=(，，，)，如果它的每个产生式是这样一种结构： (∪)　　且至少含有一个非终结符，而(∪)，则G是一个0型文法。
    　　1型文法（上下文有关文法）(context-sensitive grammars)：
    　　设G=(，，，)为一文法，若中的每一个产生式均满足|，仅仅　　除外，则文法G是1型或上下文有关的。
    　　2型文法（上下文无关文法）(context-free grammars)：
    　　设G=(，，，)，若P中的每一个产生式满足：是一非终结符，(∪)　　则此文法称为2型的或上下文无关的。
    　　3型文法（正规文法）(regular grammars)：
    　　设G=(，，，)，若中的每一个产生式的形式都是A→aB或A→a，其中A和B都是非终结，a是终结符，则G是3型文法或正规文法。
    　　0型文法产生的语言称为0型语言。
    　　1型文法产生的语言称为1型语言，也称作上下文有关语言。
    　　2型文法产生的语言称为2型语言，也称作上下文无关语言。
    　　3型文法产生的语言称为3型语言，也称作正规语言。

    思考
    老师的知识再好，没消化也不是自己的，所以还是要逐步建立自己的知识体系逐步迭代更新、扩展，同时借鉴参考老师的知识体系 构建自己的前端知识体系 - 图6

    其他：
    google调试获取html代码

    1. Array.prototype.map.call($0.querySelectorAll('code'), e => e.innerText).join('\n')