共计 8222 个字符，预计需要花费 21 分钟才能阅读完成。
2022 金三银四前端面试题预报
马上就到了面试季了，明天整顿了一下前端常见的一些面试题。虽说面试的时候造火箭，须要你背好八股文，不过很多根底还是应该把握的，就算不面试，也应该多看一些根底，内功深厚了，未来说不定还开始写框架了，嘿嘿嘿
| 我的项目介绍 |
|---|
| 你感觉前端包含什么 |
| 自我介绍 |
| 为啥到职 |
| 聊我的项目（我的项目的背景、你的角色、团队状况、技术难点、怎么解决、我的项目收益、集体播种） |
| 聊我的项目（聊的很深） |
| 职业思考 |
| 你是怎么学习前端的 |
| 你想要实现一个性能时，你不晓得 vue 怎么实现，你是怎么查找材料的 |
| 面试官简略介绍本人，而后自我介绍 |
| 学前端怎么学，本人的亮点，劣势等等 |
| 介绍一下简历上的我的项目 |
| 本人软实力方面的毛病长处 |
| 前端学习了几年了，如何学习的前端 |
| 反诘面试官您平时怎么学习前端的（面试官又反诘我先问问我怎么学习的） |
| 简略说说我的项目，没有细问，预计我的项目不是一面的重点。 |
| 如何辨别前端和后端的工作，也就是哪些事要给前端做，哪些事要给后端做。有点懵，轻易说了些。 |
| 说说自认为我的项目中体现得比拟好的中央。 |
| 说一说前端体系 |
| 我我的项目的设计构造 |
| 你感觉微信小程序和一般的 web 开发有什么区别呢 |
| 你是怎么学习前端的呢 |
| 对后续的倒退布局有什么想法 |
| 我的项目的背景是什么 |
| 以后我的项目的目标是什么 |
| 在开发过程中，你的角色是什么 |
| 在开发过程中有遇到过什么样的难题 |
| 遇到这些问题，你都是如何进行解决的 |
| 我的项目实现之后，获得了哪些成绩 |
| 你是如何提高效率的 |
| 我的项目中难点，为什么学前端 |
| 举一个值得说的点，通过本人的思考解决了什么交互难度 |
| 如何实现工程化建设 / 如何实现自动化建设? |
| 怎么重构的，是不是不理解就重构的? |
| 讲一下你做过的我的项目，在我的项目中负责什么 |
| 在我的项目中遇到了哪些艰难，是如何解决的 |
| 举一个值得说的点，通过本人的思考解决了什么交互难度 |
| 反诘阶段，问了部门的一些业务和技术栈。（因为我后面投递的起因，我不晓得这次面试的是哪个部门，又不好意思间接问是哪个部门🤣） |
| http1.0、http1.1、http2.0 的区别 |
| 介绍一下 http 缓存。 |
| Etag 和 Last-modified 比拟。 |
| encodeURI 和 encodeURIComponent 的区别 |
| http 协定报文构造 |
| http 状态码 |
| 协商缓存为什么做了 http1.1 header 字段的优化 |
| http 状态码 400 是啥 |
| http 缓存 |
| http 和 https 区别 |
| cookie 和 localstorage，cookie 个别用来做什么。外面的 domain 属性是干嘛的 |
| www.baidu.com 发送一个申请 tieba.baidu.com。会携带以下哪个 cookie |
| http2.0 更新哪些。新的二进制什么意思。多路复用怎么做的。header 压缩怎么做的 |
| 大小端存储 |
| 讲一下 TCP 为什么牢靠 |
| 讲一下 DNS 解析 |
| 讲一下 HTTP 状态码都是干什么的 |
| 讲一下 304（讲了协商缓存和强缓存） |
| HTTP2 头部压缩是如何实现的，多路复用的原理？ |
| tcp 拥塞管制 |
| http 缓存。 |
| http1.0、http1.1、http2、https 都有哪些理解。这部分比拟相熟，讲到一半面试官就掐了下一道。 |
| Cache-control 字段有哪些？作用是什么？ |
| 代理跨域？ |
| 状态码和缓存 |
| https 加密，什么是非对称加密？ |
| 浏览器的存储形式有哪些 |
| cookie 的无效作用域 |
| 跨域的 cookie 要怎么做 怎么实现 SSO 单点登录？ |
| http2.0 |
| get 申请和 post 申请的区别 |
| 两者实质是一样的 get 申请能够用 post 申请代替 那有什么存在的必要呢 |
| 网络，浏览器篇 |
| dns 解析 |
| TCP 协定、IP 协定、HTTP 协定别离在哪一层吗？ |
| tcp/ip 协定有几层 |
| 网络七层协定内容 |
| 浏览器过程和线程 |
| 谷歌浏览器为什么应用多过程 |
| 过程通信的形式 |
| https 加密过程 |
| url 到页面过程 |
| http2 和 http1 的区别 |
| 如何实现有状态的 http 协定 |
| 强缓存和协商缓存（浏览器缓存机制） |
| 强缓存 |
| 协商缓存 |
| 浏览器缓存过程 |
| 跨域申请 |
| 跨域形式 |
| TCP 三次握手为什么不能两次 |
| Tcp 为什么是 4 次挥手 |
| get 和 post |
| http 申请头中 Referer 的含意和作用 |
| HTTPS 和 HTTP 的次要区别 |
| cookie、sessionStorage 和 localStorage 的区别 |
| TCP 和 UDP 的区别 |
| Cookie 和 Session 有什么区别？ |
| 浏览器如何做到 session 的性能的？ |
| 说一下浏览器缓存； |
| 跨域的解决计划有哪些？ |
| CORS 是如何做的？ |
| 有哪些晋升浏览器性能的形式 |
| 从输出 url 到页面渲染结束都经验了什么 |
| 重绘和重排怎么了解，如何缩小 |
| http 有哪些申请形式，有什么区别 |
| http 申请和收到的字段有哪些，有什么作用 |
| localStorage 有大小限度，如果数据量过大，你有什么方法 |
| TCP 和 UDP 各自的特点和区别（三次握手四次挥手等） |
| ip 地址是什么，ipv4 和 ipv6 |
| DNS 协定理解吗 |
| cookie local Storage sessionStorage 的区别 |
| https 如何实现加密，数字证书中都包含哪些内容？ |
| 登录是怎么确定用户身份的？讲了 cookie 和 session。问了 cookie 上的 httponly 属性。 |
| 跨域 |
| 浏览器端的宏工作，微工作 |
| 我跨域的问题，如何解决，我说了后端响应时设置 Access-control-allow-origin 头部，还有 JSONP |
| 要我写 JSONP，我是首先介绍了一下它的基本原理 |
| 对于 CORS，Get 和 POST 有区别吗？ |
| 理解 HTTPS 的过程吗？ |
| websocket 和 http 比照，优缺点 |
| 跨域具体（小程序有没有跨域一说） |
| 跨域解决方案，我说的数据代理，深刻问了原理以及浏览器的同源策略，而后引出了 xss 攻打和 csrf 攻打的原理以及进攻措施 |
| 原生 AJAX 和 Fetch 的区别。Fetch 怎么监听下载进度？我说忘了。而后问了一下，是通过接管一个一个 chunk，我随口说晓得 http 有个分块传输，而后让我说说。 |
| 跨域原理 |
| ajax 和 fetch 区别 |
| 介绍一下跨域的解决方案 |
| 解决的办法 |
| 绕过的办法 |
| 说一下 jsonp 的实现原理 |
| 写出 axios 或 fetch 的根本用法 |
| webpack 如何做性能优化？ |
| 介绍一下 webpack |
| webacpk 的罕用配置 |
| webpack 的原理 |
| webpack 是如何加载文件的？ |
| webpakc 是如何实现热更新的 |
| webpack 是如何监听文件变动的 |
| webpack 是如何查找资源的 |
| 前端工程化外面怎么做到优化的（说了 webpack 的压缩代码、cdn 减速、tree shaking、提取公共代码 |
| new 一个对象产生了什么 |
| es6 新个性 |
| 如何判断一个对象为空 |
| 如何判断 symbol 对象为空 |
| 原型链，为什么要这么设计 |
| ES5 继承，寄生组合式 |
| ES6 继承，实例成员与动态成员解决 |
| CommonJS 与 ES Module 差别 |
| typeof 和 instanceof 的区别 |
| 什么是柯里化和尾递归 |
| 箭头函数和一般函数区别 |
| 说一说一般函数的 this 指向 |
| 说一下 new 的过程 |
| class 类的 public、private、static 介绍一下 |
| ul、li 事件委托 |
| e.target 相干罕用的属性 |
| onclick 和 addeventlistener 的区别 |
| 介绍一下 promise.all |
| commonJS 和 es6 模块化的区别 |
| 暂时性死区的定义 |
| 什么是事件循环，事件代理 |
| 装箱拆箱，隐式转换 |
| 事件循环，V8 与 Libuv 事件循环的差别 |
| call apply bind |
| 实现一个 bind |
| 实现一个中间件 |
| 对于词法作用域的一道题目 |
| 实现洋葱模型 |
| 模仿实现 8 进制加法 |
| 判断数组类型 |
| 实现继承 |
| js 阻塞 |
| this 指向问题！！！ |
| 看两道输入题，一个无关 this，引出箭头函数相干 |
| 一个宏微工作 Promise 相干 |
| 过程与线程的关系与区别 |
| js 数据类型 |
| 如何辨别援用类型（Object 等） |
| ES5 和 ES6 的继承 |
| this 指向规定，并有一道对于 this 的题 |
| 如何创立一个闭包 |
| promise 之前 js 如何实现异步操作，浏览器事件循环机制（宏工作和微工作） |
| 用过 promise 是吧，手写一个 Promise.all |
| JS 怎么定义一个常量对象（外部属性无奈批改），答复 Object.freeze()，毛病是要递归，能不能不递归，一时没想起来，提醒：vue3 响应式是怎么实现的？ |
| ES5 实现继承：为什么要改 Son.prototype.constructor = Son，如果不改行不行，不改会产生什么 |
| 手撕 Promise.all |
| 怎么判断 array，写一下 instanceof 和 Object.toString 怎么判断 |
| 写一下一个空数组的原型链 |
| 模块化有哪几种（说了 ES6 和 commonjs），他俩什么区别 |
| 开发的时候能间接用 es6 语法吗，为什么。（浏览器不反对 ES6）诘问，所有浏览器都不反对吗？怎么反对 ES6（答 babel），那么 babel 会怎么操作 ES6 模块化的语法呢 |
| js 根本数据类型，null 和 undefined 区别 |
| 数组办法有哪些，哪些扭转原数组，哪些不扭转原数组 |
| 手写一个 map 办法 |
| 如何判断一个数据是数组，讲一下数组和对象的关系 |
| 实现一个原型继承 |
| 基于 Promise 手写一个 promise.all |
| 根本数据类型 |
| 如何判断数组？ |
| instanceof 原理 |
| 讲原型链，如何判断属性是本身属性还是原型属性 |
| es6 的模块化和 commenjs 模块化区别 |
| js 中动画如何实现，造成页面梗塞如何解决，问了 requestAnimationFrame 这个 api |
| 将一个一般函数封装成 promise 格调，或是将 ajax 封装成 promise 格调 |
| 一道简略的 this 绑定问题。 |
| 讲讲 JavaScript 执行上下文。 |
| 脚本的几种引入形式。晓得 script 标签的哪些个性。defer 和 async 脚本。问了 crossorigin 个性，不懂。 |
| 事件循环，依据代码剖析打印程序，并解释原理。 |
| 编程题，实现相似 lodash 的 get 办法。 |
| 一个函数修复 0.1+0.2 的问题 |
| 2 种办法实现 for 外面放 settimeout 正当输入 |
| 手写公布订阅 |
| 深拷贝和浅拷贝 |
| 事件冒泡捕捉 |
| 图片懒加载 |
| 场景题：js 加锁（开关） |
| 什么是原型对象以及原型对象有什么长处。 |
| 判断数组 |
| 数据类型，如何判断数组是否为空 |
| 面向对象 |
| 函数式编程 |
| diff 算法 |
| JS 线程 |
| 如何用多线程防止 JS 单线程要解决的 DOM 元素操作抵触问题（死锁） |
| 事件循环 |
| 保护一个定时器构造，它接管两个参数，一个是执行的工夫，一个是执行的工作。 |
| 问用什么数据结构去保护这个构造，优化 |
| JS 类型判断 |
| typeof 能检测 8 种值 |
| es6 的 symbol，以及最新的 bigint |
| 函数式编程 |
| 函数的副作用 |
| 纯函数 |
| curry 的实现 |
| 偏函数 |
| es6 扩大了哪些货色 |
| 数值扩大，函数扩大啊，比方剪头函数 |
| Proxy,Reflect,Promise,class, 生成器函数，async/await |
| Proxy 对象能拦挡什么，我说总共 13 个吧 |
| Promise 我给他讲了一下这个对象，而后又顺便扩大出 JS 实现异步的 5 种形式 callback, 公布订阅模式，Promise，生成器函数，async/await 等等 |
| 实现异步的 Event Loop |
| 异步在其余语言上是怎么实现 |
| 公布订阅设计模式 |
| 原型链的题 |
| 节流函数 |
| reduce 实现 map 的性能 |
| 设计模式，就让我敲一个单例模式 |
| Es6 之前是用什么来模仿类 |
| 模仿一遍 new 关键字 写个函数 |
| 来一题原型链的 |
| var let const 区别 |
| let const 为块级作用域 申明的变量不在 window 上，所以申明后通过 window 拜访变量是 undefied |
| 箭头函数特点 call 能够扭转吗 |
| call apply bind 区别 |
| javascript 内存机制 |
| 怎么防止 js,css 等资源阻塞 |
| js 原理篇 |
| prototype 和 proto 的关系是什么 |
| 手写 jsonp |
| js 继承 |
| 预编译 |
| 长列表优化 |
| 深浅拷贝 |
| 浅拷贝 |
| 深拷贝 |
| object.create 和 object.assign |
| 尾递归（防止栈溢出的办法） |
| typeof |
| js 原型和原型链 |
| jsv8 引擎原理 |
| 编译型语言 |
| 解释性语言 |
| 比拟 |
| v8 引擎 |
| js 执行机制 |
| 单线程执行 |
| 宿主 |
| 执行栈 |
| Event Loop |
| 宏工作和微工作 |
| js 为什么设计成单线程语言 |
| 手写节流，防抖 |
| 页面性能优化 |
| defer 和 async 的区别 |
| 手写 new |
| 手写 event 类 |
| ES6 中 class 是语法还是语法糖 |
| 原型的起点 |
| 手写实现 promise，promise. all，promise. race |
| promise |
| promise.all |
| promise.race |
| 闭包优缺点 |
| function 和 object 的关系 |
| 手写 call |
| 异步执行程序（易错） |
| setTimeout |
| promise |
| async/await |
| this 指向 |
| this 绑定优先级 |
| “硬绑定”bind 为什么在 new 之后 |
| 事件委托 |
| regexp 正则，讲讲贪心模式 |
| 顺序存储构造和链式存储构造的优缺点 |
| 堆、栈和队列 |
| 写 new 的执行过程 |
| 写一个解决加法可能产生精度的函数，比方 0.1 + 0.2 = 0.3 |
| 1000000000 + 1000000000 容许返回字符串。解决大数。大数问题其实就是通过字符串来解决，从后往前加，而后解决进位的问题。 |
| es module 和 commonjs 的区别 |
| 写一个 es6 的继承过程 |
| 写一个防抖函数 |
| 如何做谬误监控的 |
| 先介绍一下有那些谬误监控形式，如 |
| try-cache |
| unhandleRejection |
| listener Event |
| vue error 钩子等等 |
| 介绍一下 typescript |
| ts 下的 never 如何了解 |
| 介绍一下 Promise.all |
| 如何确保肯定进入 then 回调 |
| 介绍一下 Promise.allSettled |
| 如果版本是一个超出平安范畴的字符串，应该如何解决呢 |
| 将 setTimeout 用 promise 封装，实现函数 delay |
| 动静加载的原理是什么？ |
| 在构造函数中用 bind 绑定的函数，前后是不是同一个，this 指向考查 |
| CSS 怎么实现边框宽度是 0.5px？ |
| flex 具体介绍属性 |
| 什么是 BFC 和 IFC |
| 伪类与伪元素差异 |
| CSS 动画里的 GPU 减速开启（3d 属性）与原理（GPU） |
| 怎么实现左右定宽，两头适应的三栏布局 |
| 双飞翼布局 |
| flex 里的 basis 解释一下 ` |
| 实现三列布局，左右固定 |
| 各种布局 flex grid table-cell |
| 革除浮动 |
| 垂直居中 |
| CSS 盒模型 |
| CSS 选择器及其优先级 |
| CSS 实现一个三角形 |
| flex 布局实现一个两边固定宽两头自适应的布局（三栏布局） |
| translate3d |
| CSS flex 布局实现一个两头居中，两边靠边的成果，其实就是 justify-content: space-between; 而后讲讲 flex 布局。 |
| CSS 的 BFC 是什么，有什么利用。 |
| 暗藏元素的几种形式。 |
| 因为下面说到了重排重绘，就针对这个点问了什么时候会导致重排重绘，如何缩小。 |
| Span 标签是否能够设置宽高，margin 和 padding 呢？ |
| 哪些操作会导致回流（重绘、回流） |
| 三栏布局 |
| 图片存储在 cdn 如何获取宽高、像素 |
| flex 前面三个属性 |
| css 画圆 |
| 双栏布局 |
| 革除浮动 |
| 程度垂直居中 |
| 列表标签、段落标签、h 标签 |
| css 文本属性高、多行文本、单行文本 … 解决 |
| margin |
| 盒子模型，规范盒子模型小试牛刀 |
| HTML5 和 HTML4 相比有什么性能的优化或标签 |
| PureComponent，flex 布局以及一些 css 的货色，比方程度垂直居中 |
| css 实现一个模态窗口，要从窗口上面向上弹的动画 |
| css 的单位比方 rem，em，问 css 的布局形式，就是只用盒子模型布局 |
| position 的布局，flex 布局，grid 布局 |
| 实现一个右边固定左边自适应的款式 |
| 实现一个自适应正方形 |
| css 篇 |
| css 盒子模型 |
| css3 新个性 |
| css 动画 |
| transition |
| transition-delay |
| transition-timing-function |
| animation |
| css 权重 |
| 三栏布局和二栏布局的实现 |
| 实现等比矩形 |
| inline 和 inline-block |
| BFC |
| clientHeight, scrollHeight, offsetHeight ,scrollTop 和 offsetTop 的区别 |
| clientHeight |
| scrollHeight |
| offsetHeight |
| scrollTop |
| offsetTop |
| css 渲染过程 |
| display 有哪些属性 |
| flex 是否实现元素竖排 |
| css 的行内元素和块级元素区别 |
| vue 和 jquery 的区别 |
| vue 生命周期 |
| 什么时候会应用 keep-alive 组件 |
| 实现一个 vue 组件，底部能够滑入滑出。 |
| 防抖节流利用场景 |
| 路由怎么实现 |
| histroy 会申请数据吗 |
| 渲染页面 |
| vue 的官网文档有看吗 |
| vue 怎么做到切换页面页面不刷新的 |
| Vue 中的计算属性是怎么实现的 |
| 写一个图片加载的函数，传入 url 和 timeout，须要解决 error 和 timeout 超时 |
| 有一个曾经上线的我的项目，我的项目中呈现了一个 bug，如果在不影响用户的状况下实现我的项目的 bug 的修复，也就是重新部署 |
| react 和 Vue 有什么区别 |
| vue 中的 key |
| 组件间通信形式 |
| vue-cli 做过哪些配置，loader 和 plugins 的区别以及罕用 plugins |
| Vue 生命周期钩子。 |
| Vuex 用过吗？简略说说。Vuex 上保留哪些变量？为什么不间接用全局变量？Vuex 上的状态最终保留到哪去？这真不知道，问了，面试官说是内存。（我：。。。） |
| computed、watch 区别 |
| vue 复用伎俩 |
| template 编译 render 过程（ast） |
| v-if、v-show |
| vue 如何解决回流重绘的问题 |
| Vue 和 React 的区别 |
| Vue 双向数据绑定原理 |
| 数组的绑定有什么非凡解决 |
| Vue3.0 的双向数据绑定是怎么做的 |
| DOM 树 和 渲染树 的区别 |
| vue 双向绑定为什么数组采纳拦挡原型来实现 |
| keep-alive 原理 |
| vuex |
| 源码思考 |
| vue3 的相干改变 |
| vue3 哪些方面变快了 |
| vue3 patchFlags |
| vue 单向数据流 |
| mvc 和 mvvm |
| 父子组件执行程序 |
| 如何实现工程化和自动化 |
| 应用 webpack 搭建我的项目 |
| 应用 eslint 查看代码标准 |
| 应用 typescript 约定类型 |
| 应用 proxy 解决跨域 |
| 应用 babel 磨平差别 |
| 应用 githooks 拦挡提交 |
| 应用 plugins / loader 做自动化解决 |
| 应用 cicd 做主动打包 |
| 应用命令行工具实现主动登录 |
| 说一下 v-for 中 key 的作用 |
| diff 的工夫复杂度是多少，如何晋升的 |
| 说一下 vue 的生命周期和父子程序 |
如果在父子组件的场景下，两个组件的生命周期程序大抵恪守 洋葱模型 |
| readonly 和 const 的区别是什么 |
| 不同页面间通信的多种实现办法 |
| scope 是怎么实现的 |
| 我的项目中动画的实现， |
| 理解虚构 DOM 吗，用代码判断两个 element 是否全等 |
| 是否晓得 html 代码生成的 dom 树，写出对应代码 |
| 介绍一下 xss 和 csrf 攻打 |
| 前端的平安问题。我的弱项，简略说了一下，XSS 和 CSRF 和罕用的预防伎俩。问了 CSP，不懂，没听过。 |
| XSS 攻打 |
| CSRF |
| XSS 和 CSRF |
| XSS 防备办法 |
| CSRF 防备办法 |
| git 根本指令 |
| git hook |
| 前端埋点计划？ |
| 我的项目做了登录吗 |
| 购物车的记录保留在哪 |
| 我想让你实现下次进来还有购物车记录怎么实现 |
| 二维码登录（没看过没接触过） |
| 前端优化有哪些 |
| 这里 cdn 减速具体怎么做的，tree shaking 的条件，提取公共代码是 webpack 间接就做了吗 |
| DNS 解析过程 |
| 图片懒加载怎么实现，offsetTop 和 scrollTop 区别。监听事件怎么设置（vue 的什么阶段 |
| 图片曾经加载过了不心愿监听怎么办。滚动事件始终触发怎么办。 |
| DNS 有几种查问形式 |
| 什么时候用递归查问，什么时候用迭代查问 |
| 阐明一下你对脚手架的了解 |
| 分页怎么做？在列表的当前页中删除了一条，怎么解决？如何缩小性能代价？减少一条呢？ |
| 一个滑动到底部主动加载下一页的长列表，当列表内容过长时，页面卡顿显著，怎么解决？我的想法是设置一个列表的最大值，达到最大值后，依据视窗，动静调整表格中加载的数据。又诘问了如何确定元素在视窗内。 |
| React native 的劣势 |
| 还原树 |
| unicode 和 utf- 8 编码 |
| node.js 有哪些罕用 API |
| react 生命周期，虚构 dom，diff 算法，keys，路由，setState 原理（这个没答上来） |
| ajax 实现原理，以及和 fetch 的区别 |
| 数组，和大于等于 n 的间断最短子序列（一开始疏忽了间断，方向错导致没写完，让说了思路） |
| 设计一个相似百度搜寻框那样随输随搜的，有哪些留神点 |
| SSR |
| SPA |
| SEO |
| GraphQL |
| GraphQL 这种形式交互有什么益处 |
| nodejs 中的几个事件循环阶段 |
| 如果不必 CORS 跨域呢 CORS 是异步的 不必 CORS 呢 有没有更好的办法 |
| 给定一个字符串，请你找出其中不含有反复字符的 最长子串 的长度。 |
| 我的项目中一个组合筛选的性能实现 |
| npm 命令行工具：主动登录 |
| 约定大于配置（模拟 dvajs 下的主动生成路由 / 插件的实现） |
| plugins 主动上报 cdn/map 等 |
正文完