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等 |