前端知识体系

85 阅读2分钟

image.png

算法

数组、链表、栈、哈希表、树、递归、分治、回溯、深度优先搜索、广度优先搜索、贪心算法、二分查找、动态规划、并查集、LRU缓存、排序算法

JS基础

  • 闭包的概念、使用场景、常见的坑
  • 原型、原型链
  • 原型链继承、构造函数继承、组合继承、组合寄生式继承
  • This指向
  • 事件循环、常见的宏任务与微任务
  • 柯里化操作
  • 深浅拷贝
  • EventTarget.addEventListener
  • JS单线程
  • 扁平化数组
  • 判断数组的几种方式
  • Object.defineProperty

ES6

  • Promise概念
  • Promise.all、Promise.race实现
  • 箭头函数
  • Async/await
  • 数组的扩展、对象的扩展
  • ES6模块和CommonJS模块
  • Set、Map、WeakSet、WeakMap
  • Proxy

CSS基础

  • BFC
  • 常见的定位以及根据什么定位:static、absolute、fixed、sticky
  • 层叠上下文
  • Flex布局
  • 实现三角形、扇形

Typescript

  • 为什么要使用Typescript
  • 泛型的理解与使用
  • Interface和type区别
  • 常见高级用法的实现,比如:Pick、Omit、Partial、Exclude
  • 理解extends关键字
  • 理解类型体操,命名空间,值空间 zhuanlan.zhihu.com/p/384172236

浏览器渲染原理

  • 从浏览器输入地址到呈现出网页的过程
  • 强缓存
  • 协商缓存

性能优化

  • 常见的性能指标:LCP、CLS、FID
  • 性能监控
  • 常见的优化策略

React/Vue

  • React和Vue区别
  • React16之后带来了哪些东西
  • React Fiber的大致思路
  • React Hook解决了什么问题,为什么不能条件语句中使用Hook
  • React/Vue父子组件生命周期调用顺序
  • React常见优化方案
  • 列表渲染为什么不建议使用index作为key
  • React diff的大致思路
  • React useCallback一定能够优化性能吗
  • 单向数据流
  • Jsx和React.createElement
  • Virtual Dom
  • React事件机制
  • React setState原理
  • Vue keepAlive的大致思路
  • MVVM

状态管理工具

  • Mobx大致实现思路
  • Mobx和Redux区别

跨域

  • 跨越是什么
  • 常见的跨域解决方案
  • CORS
  • option预检请求

网络协议

  • TCP/IP
  • 三次握手、四次挥手
  • Http1.1和http2区别
  • Https的大致思路

设计模式

  • 常见设计模式

网络安全

  • XSS攻击
  • CSRF攻击

构建工具

  • AST
  • 常用的构建工具对比
  • Webpack构建流程
  • Webpack hmr原理

NodeJS

  • NodeJs可以处理高并发的原因
  • Node事件流EventEmitter实现

正则表达式

  • 常用的正则表达式语法