【极客时间】重学前端3 列一份前端知识架构图 笔记

MDN 这样的参考手册

MDN JS 参考手册

基础部分

  1. JavaScript 语言(模块一)
  2. CSS 和 HTML(模块二)
  3. 浏览器的实现原理和 API(模块三)

实践部分

工作过程中遇到的问题和解决方案(模块四)

【极客时间】重学前端3 列一份前端知识架构图 笔记_第1张图片

运行时分为数据结构和算法部分:

数据结构包含类型和实例(JavaScript 的类型系统就是它的 7 种基本类型和 7 种语言类型,实例就是它的内置对象部分)。

所谓的算法,就是 JavaScript 的执行过程。

文法中的语法和语义基本是一一对应关系。

【极客时间】重学前端3 列一份前端知识架构图 笔记_第2张图片

HTML 的标签可以分为很多种,

head 里面的我们称为元信息类标签,诸如 title、meta、style、link、base 这些,它们用来描述文档的一些基本信息。

还有一类是一些诸如 section、nav 的标签,它们在视觉表现上跟 div 并没有区别,但是各有各的适用场景,我们把它们称作语义类标签。

另外一类是 img、video、audio 之类的替换型媒体类标签,用来引入外部内容,平常开发中你也会经常用到。

再有就是表单类的,比如 input、button。所以,基于这样的分类,我把标签分成下面几种。

  1. 文档元信息:通常是出现在 head 标签中的元素,包含了描述文档自身的一些信息;
  2. 语义相关:扩展了纯文本,表达文章结构、不同语言要素的标签;
  3. 链接:提供到文档内和文档外的链接;
  4. 替换型标签:引入声音、图片、视频等外部元素替换自身的一类标签;
  5. 表单:用于填写和提交信息的一类标签;
  6. 表格:表头、表尾、单元格等表格的结构 

HTML 的语法和几个重要的语言机制:实体、命名空间。

HTML 的补充标准:ARIA,它是 HTML 的扩展,在可访问性领域,它有至关重要的作用。

CSS部分 

在布局类我们介绍两个最常用的布局:正常流和弹性布局。绘制类我们则会分成图形相关的和文字相关的绘制。最后我们会介绍动画和其它交互。

【极客时间】重学前端3 列一份前端知识架构图 笔记_第3张图片

【极客时间】重学前端3 列一份前端知识架构图 笔记_第4张图片 

【极客时间】重学前端3 列一份前端知识架构图 笔记_第5张图片 

你可能感兴趣的:(极客时间)