front-end-knowledge

前端知识体系

javascript

• 数据类型
  • 数据类型和类型转换
  • 浮点数精度问题（0.1 + 0.2 !== 0.3）
  • 对象的浅拷贝和深拷贝
  • 集合类型 Set 和 Map
• 面向对象
  • 创建对象的方法和 new 运算符
  • this 指向和 call/apply/bind 方法
  • 原型和原型链
  • 原型链和继承（七种继承方式）
• 数组
  • 数组常用 api 总结
  • 类数组对象转换和数组拷贝（四种方法）
  • 数组去重（三种思路，九种方法）
  • 数组展开（八种方法）
  • 数组排序（十大经典排序算法）
• 函数
  • 作用域链和闭包
• 异步编程
  • callback 和 Promise
  • Generator 和 async/await
  • 手写 EventEmitter（发布订阅模式）
  • 手写 Promise 以及相关 api
• 执行机制
• 手写源码
  • 手写 instanceof 运算符
  • new
  • iterator
  • call
  • apply
  • bind
  • curry
  • forEach
  • map
  • filter
  • some
  • every
  • reduce
• 其它
  • 使用 for-of 遍历对象（iterator 接口）

css

• 选择器
  • 选择器类型
  • 选择器的优先级和计算规则
• 单位
• 布局
  • 盒模型
  • 浮动
  • 定位
  • 块级格式化上下文（BFC: Block Formatting Context）
  • 层叠上下文（Stacking Context）
  • 弹性盒子布局（Flexbox Layout）
  • 网格布局（Grid Layout）
  • 元素水平垂直居中（两种情况，九种方法）
  • 圣杯布局/双飞翼布局
• 样式

html

• DOM
• BOM(Web API)
  • 前端路由实现（hash 和 history）

http

• HTTP 协议
• 参考书籍
  • 《图解 HTTP》
  • 《HTTP/2 in Action》
  • 《HTTP 权威指南》

browser

• 浏览器缓存策略

optimize

• 防抖和节流

react

• react
  • 高级特性
    • Context
    • Ref 引用/Ref 转发
    • Portal
• react-router
• redux/react-redux
• react-query

数据结构

• 链表/双向链表/循环链表
• 栈
• 二叉树
• 二叉堆

编程题

• 打印九九乘法表
• 实现字符串翻转
• 实现千分位分隔符
• 判断是否为回文数
• 判断是否为素数/获取 n 以内的所有素数