面试
前端基础
前端知识
- JS 运行原理 by Philip Roberts
- JS 继承方式
- JS 异步解决方案的发展历程以及优缺点
- JS 作用域相关问题
- 浏览器输入URL之后发生的故事
- ES5/ES6的继承除了写法意外有什么区别
- 介绍回流、重绘 以及 如何优化。标准判断：CSS Triggers
- Http发展，Http2的多路复用
- TCP 三次握手和四次挥手的理解，详细
- TCP 稳定连接后，服务端无预警掉线重启，描述客户端和服务端的状态变换
- React 中 setState 什么时候是同步，什么时候是异步？
- npm 模块安装机制，yarn呢？
- 介绍 观察者模式 和 订阅发布模式 的区别，分别适合什么场景
- 介绍 Redux 设计思想
- 介绍 浏览器 和 Node 事件循环的区别
- 介绍 模块化发展历程：
IIFE、Ahtml、Chtml、CommonJS、Uhtml、webpack、ES Module、<script type="modlue"> - cookie 和 token 都存放在 header 中，为什么不会劫持 token？
- 浏览器缓存读取规则
- Virtual DOM 真的比操作原生 DOM 快吗？
a == 1 && a == 2 && a == 3，如何设置 a，让判断为true- 介绍 BFC 及其应用
- div 水平垂直居中
- 分析比较 opacity: 0、visibility: hidden、display: none 优劣和适用场景
手撕代码
- 模拟实现 new
- 模拟实现 apply
- 模拟实现 call
- 模拟实现 bind
- 模拟实现 instanceof
- 模拟实现 requestIdleCallback
- 模拟实现 promise
- 模拟实现 防抖 debounce 和节流 throttle
- 模拟实现 深拷贝、浅拷贝)
- 模拟实现 flatten [递归｜迭代]
- 模拟实现 sleep，从 Promise、Generator、Async/Await
- 实现 (5).add(3).minus(2) 功能
算法知识
- 广度优先遍历、深度优先遍历、先序遍历、中序遍历、后序遍历
- 排序算法，时间复杂度，稳定性，实现 冒泡排序及优化，快速排序
常考题目
- 合并两个有序数组为一个有序数组
- for 循环下打印 0-9 的所有写法
项目相关
前端框架
React
- Mixin => HOC => Hooks 发展
- React 生命周期
- 虚拟 DOM 和 DOM 节点
- Diff 算法
- Fiber 节点和 Fiber 树
- React 16 和 React 17 区别
- React 调度、调和过程
- this.setState 同步异步问题，源码解析
- React 源码解读
React-Native
- React-Native 跨端原理
- JS 与原生通信流程
- 如何编写一个 原生方法给 JS 使用
- 如何实现热更新
- metro 分包机制
- 原生与 RN 页面跳转方案
- 动画和手势操作的演示
- 双端的脚本打包
- fastlane 一键发布
Vue
- 与 React 的区别
- MVVM 框架原理
设计模式
编程题
HTTP/HTML/浏览器
- 说一下 HTTP 和 HTTPS
- TCP 三次握手，概括介绍；详细介绍；四次挥手呢
- TCP 和 UDP 的区别
- WebSocket 的实现和应用
- HTTP 请求的方式，HEAD 方式
- 一个图片 URL 访问后直接下载怎样实现
- 说一下 web Quality（无障碍）
- 几个很实用的 BOM 属性对象方法
- 说一下 HTML5 Drag API
- 说一下 HTTP2.0，HTTP 发展史
- 补充 400 和 401、403 状态码，状态码介绍
- fetch 发送 2 次请求的原因
- Cookie、sessionStorage、localStorage 区别
- 说一下 web worker
- 对 HTML 语义化标签的理解
- iframe 是什么？有什么缺点
- Doctype 作用？严格模式与混杂模式如何区分？有何意义？
- Cookie 如何防范 XSS 攻击
- 强缓存、协商缓存
- 介绍 RESTFUL
- 讲一讲 viewport 和移动端布局
- click 在 ios 上有 300ms 延迟，原因和解决方法
- addEventListener 介绍
- 画一个三角形 CSS
- HTML5 新增元素
- 输入一个 URL，完整流程
- 常见的 HTTP 头部
- cache-control 的值有哪些
- 完整的页面渲染过程
- CSRF 和 XSS 的网络攻击及防范
CSS
- CSS 盒模型介绍
- 画一条 0.5px 的线
- link 标签 和 import 标签的区别
- transition 和 animation 的区别
- flex 布局介绍
- BFC，产生原因，作用
- 垂直居中的几种方式
- JS 动画 和 CSS3 动画的差异性
- 说一下 块元素和行元素
- 多行元素的文本省略号
- 双边距重叠问题
- position 属性比较
- 浮动清除的方法
- CSS3 新特性
- CSS 选择器有哪些，优先级
- CSS3 对溢出的处理
- float 的元素，display 是什么
- 三栏布局的实现方式
- calc 属性
- 重排和重绘
- overflow 原理
- box-sizing 的语法和基本用处
- display: none 和 visibility: hidden
- CSS 预处理器
JavaScript
- get 请求传参长度的误区
- get、post 在缓存方面的区别
- 闭包
- 类的创建和继承，继承方法
- 解决异步毁掉地狱
- 事件流
- 如何设置事件先冒泡后捕获
- 事件委托
- 图片的懒加载和预加载
- mouseover 和 mouseenter 的区别
- new 操作符原理
- 改变函数内部 this 指针的指向函数
- JS 位置判断，如何监听元素是否显示在可视区域。例如：clientHeight、scrollHeight、offsetHeight，scrollTop、offsetTop、clientTop
- JS 拖拽功能的实现
- 异步加载 JS
- 节流和防抖
- 垃圾回收机制
- 前端模块化
- CommonJS、Ahtml、Chtml
- 深拷贝、浅拷贝
- 手写 promise
- 监听对象属性的改变
- setTimeout、setInterval、requestAnimationFrame 的区别
- 实现一个两列等高布局
- bind、call、apply 手写
- JS 控制一次加载一张图片，完成后再加载下一张
- 代码的执行顺序
- 如何实现 sleep 效果
- Function.__proto__ / getPrototypeOf 是什么
- node 的 Events 模块
- 箭头函数中 this 指向问题，箭头函数特性
- JS 类型判断，typeof、instanceof
- 数组常用方法
- 数组去重
- 判断一个数组
- 跨域
- 暂时性死区
- 事件模型
- async/await
- promise + Generator + async
- JS 加载阻塞，解决方法
- 实现一个轮播效果
- 事件循环
- arguments
- 箭头函数 和 function 的区别
前端进阶
工程化
- babel 原理
- 如何实现一个 babel 插件
- git 工作流描述
- rebase 和 merge 的区别
- git reset、git revert、git checkout 描述
- webpack 和 gulp 的区别，模块化与流的区别
Vue
- 对 Vue 的理解
- 优缺点
- Vue 与 React 的区别
- 虚拟 DOM
- vue 生命周期
- vue 如何监听键盘事件
- watch 怎么深度监听对象变化
- 删除数组使用 delete 和 Vue.delete 有什么区别
- watch 和计算属性 区别
- vue 双向绑定原理
- v-model 是什么，如何使用
- 3.0 为什么使用 Proxy API 替代 defineProperty API
- 3.0 优化了什么
- 3.0 新特性，Composition API
- 权限管理如何做
- created 和 mounted 两个生命周期中请求数据有什么区别
- 对 proxy 的理解
React
- React 生命周期
- 如何划分业务组件、技术组件
- 性能优化
- 虚拟 DOM 为什么提高性能
- diff 算法描述
- flux 思想
- redux 中间件，saga、thunk
- redux 缺点
- React 解决了什么问题，为什么选用
- React 协议
- shouldComponentUpdate
- 类组件和函数组件区别
- 状态和属性 区别
- 高阶组件
- React 中使用箭头函数优点
- 为什么建议传给 setState 的参数是一个 callback 而不是一个对象
- 除了在构造函数中绑定 this，还有其他方式吗
- 如何阻止组件渲染
- 列表 key 如何设置。目的为何
- 什么是 JSX
大纲