“前端全方位面试题目，与大家共同学习，也是对自己的一次总结”
JavaScript，CSS，HTML，算法，性能优化，TS，React，Vue，ES6，NodeJS，还有计算机网络等...共有【945道】。
（文章比较长，耐心看完，让你面试提升一大截！）
1、JavaScript面试题（323题）
- 不会冒泡的事件有哪些?
- mouseEnter 和 mouseOver 有什么区别?
- MessageChannel 是什么，有什么使用场景?
- async、await 实现原理
- Proxy 能够监听到对象中的对象的引用吗?
- 如何让 var [a, b]= {a: 1,b:2}解构赋值成功?
- 下面代码会输出什么?
- 描述下列代码的执行结果
- 什么是作用域链?
- bind、call、apply 有什么区别?如何实现一个bind?
- common.js和es6中模块引入的区别?
- 说说 vue3 中的响应式设计原理
2、CSS面试题（61题）
- css 中的 animation、transition、transform 有什么区别?
- 怎么做移动端的样式适配?
- 相邻的两个inline-block节点为什么会出现间隔，该如何解决?
- grid网格布局是什么?.
- SS3新增了哪些特性?
- 怎么使用 CSS3 实现动画?
- 怎么理解回流跟重绘?什么场景下会触发?
- 什么是响应式设计?响应式设计的基本原理是什么?如何进行实现?
- 如果使用CSS提高页面性能?
- 如何实现单行/多行文本溢出的省略样式?
- 如何使用css完成视差滚动效果?
- 怎么使用 CSS 如何画一个三角形
4、React面试题（83题）
- 下面代码中，点击"+3”按钮后，age 的值是什么?
- React Portals 有什么用?
- react 和 react-dom 是什么关系?
- React 中为什么不直接使用 requestIdleCallback?
- 为什么 react 需要 fiber 架构，而 Vue 却不需要?
- 子组件是一个 Portal，发生点击事件能冒泡到父组件吗?
- 说说React render方法的原理?在什么时候会被触发?
- 说说React事件和原生事件的执行顺序
- 说说对受控组件和非受控组件的理解，以及应用场景
- 你在React项目中是如何使用Redux的?项目结构是如何划分的?
- 说说对Redux中间件的理解?常用的中间件有哪些?实现原理?
- 说说你对Redux的理解?其工作原理?
5、Vue面试题（80题）
- Vue 有了数据响应式，为何还要 diff ?
- vue3 为什么不需要时间分片?
- vue3 为什么要引入 Composition API ?
- 谈谈 Vue 事件机制，并手写off、once
- computed 计算值为什么还可以依赖另外一个 computed 计算值?
- 说-下 vm.$set 原理
- 怎么在 Vue 中定义全局方法?
- Vue 中父组件怎么监听到子组件的生命周期?
- vue组件里写的原生addEventListeners监听事件，要手动去销毁吗?为什么?
- 说说 vue3 中的响应式设计原理
6、算法面试题（19题）
- 最大的钻石
- 举例说明你对尾递归的理解，以及有哪些应用场景?
- 去除字符串中出现次数最少的字符，不改变原字符串的顺序。
- 请手写"快速排序”
- 洗牌算法
- 什么是尾调用优化和尾递归?
- 合并K个升序链表
- 什么是时间复杂度?
- 请手写“基数排序”
- 请手写“桶排序”
- 请手写“计数排序”
7、计算机网络（71题）
- 简单描述从输入网址到页面显示的过程
- 说说webSocket和HTTP的区别
- 说说 https 的握手过程
- HTTP2中，多路复用的原理是什么?
- 说说你对“三次握手”、“四次挥手”的理解
- 为什么推荐将静态资源放到cdn上?
- 什么是DNS劫持?
- TLS 1.3 做了哪些改进?
- TLS1.2 握手的过程是怎样的?.
- HTTP 报文结构是怎样的?
- HTTPS 为什么是安全的?
- Axios的原理是什么?
8、Node.js面试题（27题）
- common.js和es6中模块引入的区别?
- 为什么Node在使用es module时必须加上文件扩展名?
- 浏览器和 Node 中的事件循环有什么区别?
- Node性能如何进行监控以及优化?
- 如果让你来设计一个分页功能,你会怎么设计?前后端如何交互?
- 如何实现文件上传?说说你的思路
- 如何实现iwt鉴权机制?说说你的思路
- 说说对中间件概念的理解，如何封装 node 中间件?
- 说说 Node 文件査找的优先级以及 Require 方法的文件查找策略?
- 说说对Nodejs中的事件循环机制理解?
- 说说Node中的EventEmitter?如何实现-个EventEmitter?
- 说说对 Node 中的 stream 的理解?应用场景?
9、TypeScript面试题（46题）
- 说说对 TypeScript 中命名空间与模块的理解?区别?
- 说说你对 typescript 的理解?与 javascript 的区别?
- Typescript中泛型是什么?
- TypeScript中有哪些声明变量的方式?
- 什么是Typescript的方法重载?
- 请实现下面的 sleep 方法
- typescript 中的 is 关键字有什么用?
- TypeScript支持的访问修饰符有哪些?
- 请实现下面的 myMap 方法
- 请实现下面的 treePath 方法
- 请实现下面的 product 方法
- 请实现下面的 myAIl 方法
10、性能优化（25题）
- script标签放在header里和放在body底部里有什么区别?
- 前端性能优化指标有哪些?怎么进行性能检测?
- SPA(单页应用)首屏加载速度慢怎么解决?
- 如果使用CSS提高页面性能?
- 怎么进行站点内的图片性能优化?
- 虚拟DOM一定更快吗?
- 有些框架不用虚拟dom，但是他们的性能也不错是为什么?
- 如果某个页面有几百个函数需要执行，可以怎么优化页面的性能?
- 讲-下png8、png16、png32的区别，并简单讲讲 png 的压缩原理
- React,memo()和 useMemo()的用法是什么，有哪些区别?
13、ES6面试题（32题）
- common.js和es6中模块引入的区别?
- Map 和 Set 的用法以及区别
- es5 中的类和es6中的class有什么区别?
- 你是怎么理解ES6中 Decorator 的?使用场景有哪些？
- 你是怎么理解ES6中Modue的?使用场景有哪些?
- 你是怎么理解ES6中Proxy的?使用场景有哪些？
- 怎么理解ES6中 Generator的?使用场景有哪些?
- 你是怎么理解ES6中 Promise的?使用场景有哪些?
- ES6中新增的Set、Map两种数据结构怎么理解?
- ES6中函数新增了哪些扩展?
- ES6中对象新增了哪些扩展?
- ES6中数组新增了哪些扩展?
16、工程化(34题)
- package.json 文件中的 devDependencies 和 dependencies 对象有什么区别？
- webpack5的主要升级点有哪些?
- 说下vite的原理
- 与webpack类似的工具还有哪些?区别?
- 说说如何借助webpack来优化前端性能?
- 说说webpack proxy工作原理?为什么能解决跨域?
- 说说webpack的热更新是如何做到的?原理是什么?
- 面试官:说说Loader和Plugin的区别?编写Loader，Plugin的思路?
- 说说webpack中常见的Plugin?解决了什么问题?
- 说说webpack中常见的Loader?解决了什么问题?
- 说说webpack的构建流程?
