Skip to content

面试宝典总结

JS 基础

  • 0.1 + 0.2 !== 0.3

  • JS 类型有哪些?

  • 大数相加、相乘算法题

  • 修改对象得出结果笔试题

  • JS 类型如何判断,有哪几种方式可用

  • instanceof 原理

  • 手写 instanceof

  • == 和 === 操作符有什么区别

  • == 操作符的类型转换规则

  • 浅拷贝和深拷贝的区别是什么

  • JSON.parse(JSON.stringify(a)) 存在什么问题

  • 手写深拷贝函数

  • 如何理解原型及原型链

  • 如何重写原型,这个在下一章节的继承小节中有解释

  • 原型链指向

  • 什么是提升?

  • 什么是暂时性死区?

  • var、let 及 const 区别?

  • 原型如何实现继承?

  • Class 如何实现继承?

  • Class 本质是什么?

  • Proxy 可以实现什么功能?

  • map, filter, reduce 各自有什么作用?

  • Map、WeakMap、Object 区别

  • 什么是回调函数?

  • 回调函数有什么缺点?

  • 如何解决回调地狱问题?

  • 你理解的 Generator 是什么?

  • 主要考手写 Promise

  • Promise 的特点是什么,分别有什么优缺点?

  • 什么是 Promise 链?

  • Promise 构造函数执行和 then 函数执行有什么区别?

  • all、race、allSettled 各有什么作用?

  • async 及 await 的特点

  • 它们的优点和缺点分别是什么?

  • setTimeout、setInterval、requestAnimationFrame 区别是什么?

  • 进程线程区别

  • JS 单线程执行带来的优缺点

  • 什么是执行栈

  • 如何理解 Event loop

  • Node 中的 Event Loop 和浏览器中的有什么区别?

  • process.nexttick 执行顺序?

  • V8 下的垃圾回收机制是怎么样的?

衍生思考题

  • 思考题一:JS 分为哪两大类型?都有什么各自的特点?你该如何判断正确的类型?

    • 对于原始类型来说,你可以指出 null 和 number 存在的一些问题。
    • 对于对象类型来说,你可以从垃圾回收的角度去切入,
    • 也可以说一下对象类型存在深浅拷贝的问题。
    • 对于判断类型来说,你可以去对比一下 typeof 和 instanceof 之间的区别,也可以指出 instanceof 判断类型也不是完全准确的。
  • 思考题二:你理解的原型是什么?

    • 原型小节中的总结内容,然后还可以指出一些小点,比如并不是所有函数都有 prototype 属性,
    • 然后引申出原型链的概念,提出如何使用原型实现继承,继而可以引申出 ES6 中的 class 实现继承
  • 思考题三:bind、call 和 apply 各自有什么区别?

    • 首先肯定是说出三者的不同,如果自己实现过其中的函数,可以尝试说出自己的思路。
    • 然后可以聊一聊 this 的内容,有几种规则判断 this 到底是什么,
    • this 规则会涉及到 new,那么最后可以说下自己对于 new 的理解
  • 思考题四:ES6 中有使用过什么?

    • 比如说说 class,那么 class 又可以拉回到原型的问题;
    • 可以说说 promise,那么线就被拉到了异步的内容;
    • 可以说说 proxy,那么如果你使用过 Vue 这个框架,就可以谈谈响应式原理的内容;
    • 同样也可以说说 let 这些声明变量的语法,那么就可以谈及与 var 的不同,说到提升这块的内容
  • 思考题五:JS 是如何运行的?

    • 可以先说 JS 是单线程运行的,这里就可以说说你理解的线程和进程的区别。
    • 然后讲到执行栈,接下来的内容就是涉及 Eventloop 了,微任务和宏任务的区别,哪些是微任务,哪些又是宏任务,
    • 还可以谈及浏览器和 Node 中的 Eventloop 的不同,最后还可以聊一聊 JS 中的垃圾回收

掘金地址

浏览器基础知识点及常考面试题

  • 事件机制
  • 事件触发三阶段
    • 注册事件
    • 事件代理
  • 跨域
    • JSONP
    • CORS
    • document.domain
    • postMessage
  • 存储
    • cookie,localStorage,sessionStorage,indexDB
    • Service Worker

浏览器缓存机制

  • 缓存位置
    • Service Worker
    • Memory Cache
    • Disk Cache
    • Push Cache
    • 网络请求
  • 缓存策略
    • 强缓存
    • 协商缓存

浏览器渲染原理

  • 浏览器接收到 HTML 文件并转换为 DOM 树
  • 将 CSS 文件转换为 CSSOM 树
  • 生成渲染树
  • 为什么操作 DOM 慢
  • 什么情况阻塞渲染
  • 重绘(Repaint)和回流

安全防范知识点

  • XSS
    • 转义字符
    • CSP
  • CSRF
    • 如何防御
  • 点击劫持
    • X-FRAME-OPTIONS
    • JS 防御
  • 中间人攻击

性能优化琐碎事

  • 图片优化
    • 计算图片大小
    • 图片加载优化
  • DNS 预解析
  • 节流
  • 防抖
  • 预加载
  • 预渲染
  • 懒执行
  • 懒加载
  • CDN

Webpack 性能优化

  • 减少 Webpack 打包时间
    • 优化 Loader
    • HappyPack
    • DllPlugin
    • 代码压缩
    • 一些小的优化点
  • 减少 Webpack 打包后的文件体积
    • 按需加载
    • Scope Hoisting
    • Tree Shaking

React 和 Vue 两大框架之间的相爱相杀

  • MVVM
  • Virtual DOM
  • 路由原理
    • Hash 模式
    • History 模式
    • 两种模式对比
  • Vue 和 React 之间的区别

Vue 常考基础知识点

  • 生命周期钩子函数

  • 组件通信

    • 父子通信
    • 兄弟组件通信
    • 跨多层次组件通信
    • 任意组件
  • extend 能做什么

  • mixin 和 mixins 区别

  • computed 和 watch 区别

  • keep-alive 组件有什么作用

  • v-show 与 v-if 区别

  • 组件中 data 什么时候可以使用对象

  • Vue 常考进阶知识点

    • 响应式原理
    • Object.defineProperty 的缺陷
    • 编译过程
    • NextTick 原理分析

React 常考基础知识点

  • 生命周期

  • setState

  • 性能优化

  • 通信

    • 父子通信
    • 兄弟组件通信
    • 跨多层次组件通信
    • 任意组件
  • React 常考进阶知识点

  • HOC 是什么?相比 mixins 有什么优点?

  • 事件机制

  • 更新内容

监控

  • 页面埋点
  • 性能监控
  • 异常监控

TCP

  • 头部
  • 状态机
    • 建立连接三次握手
    • 断开链接四次握手
  • ARQ 协议
    • 停止等待 ARQ
    • 连续 ARQ
    • 累计确认
  • 滑动窗口
    • Zero 窗口
  • 拥塞处理
    • 慢开始算法
    • 拥塞避免算法
    • 快速重传
    • TCP New Ren 改进后的

HTTP/2 及 HTTP/3

  • HTTP/2
  • 二进制传输
  • 多路复用
  • Header 压缩
  • 服务端 Push
  • HTTP/3
    • QUIC

设计模式

  • 工厂模式
  • 单例模式
  • 适配器模式
  • 装饰模式
  • 代理模式
  • 发布-订阅模式
  • 外观模式

Released under the MIT License.