问渠哪得清如许

本文最后更新于:2022年10月6日 上午

学习进度

标记说明

  • 🔵 学习或使用过
  • 🟡 希望学习或使用
  • 🔴 暂时观望

开发工具

浏览器

2/5

🔵Chrome

🔵Edge

🟡Firefox

🔴Opera

🟡Safari

编辑器

1/7

🔵VSCode

🟡WebStorm

🔴Atom

🟡Sublime Text

🔴HBuilder X

🔴 记事本

🟡 在线 IDE

文档笔记

3/7

🔵Markdown 语法

🔵Typora

🔴 语雀

🔴 腾讯文档

🔴 石墨文档

🔴 印象笔记

🔴Mdnice

HTML

标签

5/10
🔵head
🔵div与H5语义化
🔵标题与段落
🔵图像与H5多媒体
🟡列表 ul / ol
🔵超链接 a
🟡表单 form
🟡表格 table
🟡框架 iframe
🟡内联 SVG

特性与 API

2/8
🟡浏览器支持
🔵Canvas 画布
🔵localStorage
🟡sessionStorage
🔴Web SQL
🔴Web Workers
🔴应用缓存(Cache Manifest)
🔴无障碍

CSS

基本语法

引入方式

3🎯
🔵行内样式
🔵内部样式表
🔵外部样式表

选择器

11🎯
🔵通用选择器
🔵标签选择器
🔵id 选择器
🔵class 选择器
🔵属性选择器
🔵组合选择器
🔵伪选择器
🔵选择器优先级

派生选择器

🔵后代选择器
🔵子元素选择器
🔵相邻兄弟选择器

属性

11🎯

单位

🔵px
🔵vw vh
🟡em rem

背景

🟡图片
🔵渐变

文本


字体


列表


表格

文档流

0/3
🟡标准流
🔵浮动流
🟡定位流

内联元素 / 块状元素

盒子模型

5🎯
🔵content
🔵padding
🔵border
🔵margin
🔵box-sizing

浮动

1/2
设置浮动 float
清除浮动 clear

定位

1/5
🔵static
🔵absolute
🔵fixed
🔵relative
🔵sticky

层叠规则

BFC 和 IFC 机制

CSS3

响应式布局

2/5
Flex 布局
Grid 布局
瀑布流

媒体查询

添加断点
常见断点

动效

3🎯
🔵动画
🔵过渡
🔵2D / 3D 转换

其他

3🎯

渐变

线性渐变
径向渐变

背景

边框

圆角

字体

JavaScript

*为 ES6 语法

数据类型

原始类型

5/8
字符串 String
数值 Number
布尔 Boolean
空值 Null
未定义 Undefined
*Symbol
*BigInt
隐式转换

引用类型

2/7
对象 Object
数组 Array
*Map
*WeakMap
*Set
*WeakSet
函数 Function

函数

自定义函数

2/7

调用方式

箭头函数
全局调用
构造函数调用

函数方法调用

apply
call
闭包

对象

概念

this

原型链和继承

常用对象

2/6
数字 Number
字符串 String 对象
日期 Date 对象
数组 Array
布尔 Boolean
数学 Math

自定义对象

作用域(作用域链)

BOM API

DOM API

JSON

Ajax

JavaScript 执行机制

ES6 语法

1/5
let 和 const
变量解构赋值
对象扩展和新增方法
Symbol
Set 和 Map 数据结构

新语法

2/4
迭代器
模块
Generator 函数异步编程
Promise & async / await 异步编程

前端基础知识

互联网

0/3
域名
DNS
服务器

浏览器

0/8
浏览器 DOM 事件流 / 事件委托
浏览器加载顺序
浏览器渲染过程
浏览器事件循环
浏览器同源策略
跨域解决方案
浏览器缓存
控制台调试技巧

HTTP

0/11

HTTP 请求过程

三次握手


常见 HTTP 协议

HTTP 1.0
HTTP 1.1
HTTP 2
HTTP 3

HTTP 请求类别


常见状态码

1xx 信息
2xx 成功
3xx 重定向
4xx 客户端错误
5xx 服务器错误

其他

0/4
WebSocket
🟡Cookie
Session
🟡HTTPS

计算机基础

算法和数据结构

1/9
🔵时间复杂度分析
🔵空间复杂度分析

数据结构

数组
字符串
队列
链表
集合
哈希表
二叉树

算法

排序

2/10
冒泡排序
选择排序
插入排序
希尔排序
  • 双指针
  • 查找
  • 分治
  • 动态规划
  • 递归
  • 回溯
  • 贪心
  • 位运算
  • DFS
  • BFS

计算机网络 HTTP 协议

  • 网络模型
  • UDP / TCP 协议

操作系统

  • 进程、线程
  • 进程 / 线程间通讯方式
  • 进程调度算法
  • 进程 / 线程状态
  • 死锁
  • 内存管理

软件开发基础

设计模式

0/7
单例模式
代理模式
工厂模式
装饰者模式
观察者模式
策略模式
门面模式

Git 版本控制

  • 常用命令

Linux 服务器

  • 常用命令

正则表达式

代码托管

2/3
🔵GitHub
🔵Gitee
🟡GitLab

Node.JS

包管理

3/5
🔵npm
🔵yarn
🔴bower
🟡npx
🔵pnpm

Node.js 开发框架

0/3
Express
Koa
Egg

CSS 框架

0/2
BootStrap
Tailwind CSS

JavaScript 框架

Vue

1/9
🟡组件注册
🟡基础指令
🔵事件与自定义事件
🟡生命周期
🟡组件通信
🟡响应式数据
🟡组件插槽
🟡内置组件
🟡内置API

Vue-router

0/2
组件通信
组件通信
组件通信
组件通信

Pinia

0/2
组件通信
组件通信
组件通信
组件通信

Axios

0/2

Vuex

0/2

React

0/2

React DOM

React Router

Redux

MobX

React Hooks

Angular

RxJS

NgRx

Svelte

UmiJS

封装库

组件库

3/7
LayUI
ElementUI(Vue2.x)
ElementPlus(Vue3.x)
ArcoDesign
VantUI(Vue)
Ant Design(React)
Material UI

数据可视化

0/4
AntV
Apache ECharts
HighCharts
D3.js

组件(插件)

0/3
富文本编辑器
弹窗
轮播图

工具库

0/4
jQuery
Lodash
Axios
时间处理 Moment.js

动效库

0/2
Animate.css
Ant Motion

字体图标库

0/3
IconFont
IconPark
Font Awesome

脚手架

0/4
Vue CLI
create-react-app
Yeoman
Vite