精品模板 前端基础 & 前端面试
2023-11-08 22:31:45 13 举报AI智能生成
前端面试基础知识整理（不定时更新）
作者其他创作
大纲/内容
前端基础 & 前端面试（FE）
简历介绍
对前端发展怎么看？有自我的规划吗？平时有什么非技术相关的爱好吗？
有自己的专栏或者博客，或者开源的GitHub项目吗？平时在哪里学习？今年看了哪些不错的书籍或者文章有什么推荐吗？
专业技能
阅读量 & 运动量
生活爱好
个人 & 持续成长
做过什么项目，主要解决了什么问题？遇到了什么难点？项目收益是什么
项目中前后端角色如何分配，沟通流程呢？gitflow？多人如何开发合作？
项目技术选型是什么?这样技术选型有什么优缺点?低代码和可视化了解吗?做过的几个项目中有遇到什么难点吗?你对前端的发展怎么看？
口述
展示（有的需要
项目
Step1（初步认识
非递归深度遍历 & 非递归广度遍历
爬楼梯问题
动态规划
动态爬楼梯（动态规划
算法（手写代码
http缓存策略了解吗?强缓存和协商缓存什么区别?优先命中哪个？
http2.0可以减少网络延迟为什么很多公司还是用1.1的版本
http1.0与http2.0的区别，http和https的区别？为什么2.0发展受阻
http
高频
计算机基础
你觉得jquery源码有哪些写的好的地方
非必要知识
图片懒加载实现原理是什么?什么是渐进加载？页面滚动需要请求加载数据太频繁怎么处理提高性能?节流和防抖了解吗?引用场景是什么?
web woker
大数据页面切换怎么提升用户体验？
大数据处理问题
工程能力基础
generator并发模型
LRU缓存
请求重试策略
写一个深拷贝
深拷贝和浅拷贝
节流
防抖
节流和防抖
实现一个基本的promise
实现一个双向数据绑定
发布订阅模式
async await
实现一个继承方法
继承
简单的流程
用promise来实现ajax
手写实现ajax
ajax
实现apply和call
实现bind
call bind apply
函数科里化
字符串模板
实现new操作
Object.create实现原理
Object
实现instanceof
实现一个基本的Event Bus
事件总线
偏函数 & 数组
JavaScript手写
遍历DOM
树转表
表转树
树转表 & 表转树
DOM手写
解析URL作为对象
用setTimeout模拟setInterval
实现一个简单路由
怎么实现图片懒加载
怎么设置rem
实现拖拽
JavaScript检测横屏
对下面代码进行优化
写个冒泡排序和快排
我要猜1~1000内中间的一个正整数， 要猜几次才能猜中
写一个事件委托函数
实际的几个问题
promise的具体实现
把多维数组降到一维
用setTimeout来实现setInterval
js怎么控制一次加载一张图片，加载完后再加载下一张
如何实现sleep的效果
怎么解决回调地狱
怎么实现轮播
实现一个两列等高布局
业务问题
前端相关手写代码
数据结构与算法能力
Coding能力
Step2（通用知识
如果让你来设计一个RN热更新服务需要考虑哪些地方？
让你搭建一个mook系统，设计思路是什么？
mock
怎么设计一个前端监控系统，怎么实现监控
cookie跨域问题解决
Cookie + Session 登录
SSO认证中心就类似一个中转站，CAS也是
Token登录
SSO单点登录
需要申请三方的 appid、appsecret
OAuth第三方登录
登录方案(关键是Token
cookie 为什么是最方便的存储方案，有哪些操作 cookie 的方式
cookie
session 方案是如何实现的，存在哪些问题
session
token 方案是如何实现的，如何进行编码和防篡改
token
jwt 是做什么的
jwt
前端怎么鉴权
前端怎么做反页面爬虫？有设计思路吗？
安全管理
监控和安全系统
常见的埋点设计方案是什么，埋点跨域怎么解决
埋点系统
系统搭建
作为前端架构师需要考虑的因素
对immutable的理解
设计serverless大平台需要考虑哪些事情
常见设计思想
设计思想
怎么判断变量是数组
alert( NaN === NaN ); NaN 是一个特殊的数值型值，它与任何值进行比较都会返回 false
使用toFixed，请注意，toFixed 总是返回一个字符串。
类型处理
数组排序
数组去重的方法
数组降维
去重 & 降维 & 排序
怎么初始化数组
new Array
从一个数组里删除另一个数组里的元素
构造
数组
JavaScript有哪些方法定义对象
智能参数
数组解构
...解构
创建
Object.assign拷贝
递归克隆
lodash的cloneDeep实现方法
深拷贝
讲下浅拷贝和深拷贝
判断对象中是否有某属性
判断是否是对象
Object.defineProperty()
Object方法
对象
数组与对象
去除字符串首尾空格
slice
substring（返回一个索引和另一个索引之间的字符串
substr（返回指定位置开始的指定字符数的字符
includes
codePointAt & fromCodePoint & localeCompare
字符串
for ... of循环和for ... in循环有何区别
==和===、以及Object.is的区别
setTimeout、setInterval和requestAnimationFrame之间的区别
怎么进行js类型判断
offWidth/clientWidth/scrollwidth有什么区别
布局
JSON.stringify
JSON.parse
JSON转换
日期与时间
0.1 + 0.2 !== 0.3
基础方法
数学
逗号运算符
其他
基础语法
箭头函数和function有什么区别
箭头函数
module
async和await
promise.all和promise.race
手写代码
generator函数
实现一个promise
如果已经有三个promise，A、B和C，想串行执行，该怎么写
promise
class
map
set
WeakMap 和 WeakSet
set和map
const
let和const
手写实现
有什么优点
proxy
简单介绍一下symbol
箭头函数的特性
简单讲讲ES6的一些特性
说下promise.all和promise.race
ECMAScript6怎么写class么，为什么会出现class这种东西?
说说你对ES6的了解
Symbol
ES6
ES6/ES7
AMD (Modules/Asynchronous-Definition) 、CMD (Common Module Definition)规范区别?
说一下Commonjs、AMD和CMD
requireJS的核心原理是什么? (如何动态加载的? 如何避免多次加载的?如何缓存的? )
谈一下AMD和commonjs
什么是按需加载
如何理解前端模块化
严格模式有哪些限制
说说你知道的JavaScript编写规范
规范
requestanimationframe可以解决
p屏幕分辨率问题
执行时间是不确定的
为什么会在低端机上出现动画不流畅抖动等问题
setTimeout
requestanimationframe
动画
js延迟加载的方式有哪些?
new操作符做了什么事情
加载构建
基础知识
将原生的ajax封装成promise
同步和异步差别
event loop
异步和单线程差别
前端异步的场景
web work
AMD CMD commonJS
async和defer
异步加载js方式有什么
常见的异步有什么
异步
如何使不同页面之间进行通信
Ajax是什么?如何创建一个Ajax?
讲一下ajax原理和流程
ajax原理
ajax和axios有什么区别
Ajax解决浏览器缓存问题
readyState有哪4种状态
Fetch和Ajax比有什么优缺点
fetch
ajax和fetch
缓存与通信
一般内存泄漏是什么原因怎么解决
计算过程有人打算和你说话，但是你很专注，说稍等下我算完下和你说。
计算不能被打断的同学，计算过程被人打断了，他说又要重新算一次。
js的节流和防抖
谈谈Event Loop中的Job queue
JS中的垃圾回收机制
DOM0事件
事件传播机制
DOM2事件
冒泡机制
讲一下事件代理(事件委托)
讲下事件流
事件代理
JS单线程
宏事件
微事件
事件循环
事件
哪些操作会造成内存泄漏
内存与事件
如何实现一个私有变量，用getName方法可以访问，不能直接访问
Function._proto_(getPrototypeOf)是什么
js监听对象属性的改变
原型和原型的定义
讲下js的继承
原型式继承
寄生式继承
继承对象
构造函数的继承
原型链的继承
组合式继承
继承构造函数
寄生组合式继承
class继承
继承的写法
原型和原型链
IIFF ( 立即执行函数 )
函数表达式 & 函数声明
函数
箭头函数的this
this指向问题
call
apply
说下bind函数
bind
谈谈对this的理解
eval是做什么的
说说eval怎么用
闭包
JS作用域有什么用
js有没有块级作用域
静态作用域什么意思
什么叫暂停死区
作用域和闭包
严格模式和混杂模式有什么区别
原理问题
进阶问题
JavaScript
TypeScript
JavaScript & TypeScript
html标签有几个可以逃过同源策略
attribute和property有什么区别
img的title和alt有什么区别
什么是语义化
html5有哪些新特新
html5离线存储怎么使用
iframe有什么缺点
xhtml和html有什么区别
canvas和svg有什么区别
说一下HTML5 drag api
iframe是什么？有什么缺点？
h5新增
前端SEO要注意哪些
异步加载的方式有哪些?
html
CSS的BFC有了解吗?scale和zoom放大有什么区别?重绘和重排有什么区别?举几个会引起重排的属性?改变背景图引起重排?
postcss你自己会配置么？怎么让postcss加兼容性前缀？
postcss
Sizzle库的实现
选择器
content-box
border-box
盒模型
形成
讲一下BFC块格式化上下文
float清除浮动
flex的三个属性是什么？
flex
兼容
position
行内元素和块级元素互相转换
sass写法
详解下双飞翼布局和圣杯布局
流体布局、圣杯布局、双飞翼布局
如何实现居中
居中布局
float有什么要注意的点
怎么清除浮动
你知道grid布局吗
讲一下position定位
讲一下flex布局
animation动画知道吗
transition和animation有什么区别
你了解重绘和回流吗
行内元素有哪些有什么区别
link和@import区别
标准css盒子模型和低版本ie盒子模型有什么差别
多终端IOS安卓分辨率兼容
浏览器版本兼容问题
交互动画特效
画一条0.5px的线
transition和animation的区别
多行文本省略号
双边距重叠问题（外边距折叠）
display：table和本身的table有什么区别
z-index的定位方法
设置一个元素的背景颜色，背景颜色会填充哪些区域？
inline-block、inline和block的区别
画个正方体
浏览器的窗口大小
em是相对于父元素的还是相对于自身
什么是SVG
什么是outline
css设置链接样式
说下关于position定位
什么是置换元素
:单冒号和::双冒号什么区别
display: none 和 visibility:hidden有什么区别
nth-of-type和nth-child的区别
常见的布局和实现
盒子模型和弹性盒布局
BFC、IFC、 GFC、FFC: FC (Formatting Contexts)，格式化上下文
左边定宽，右边自适应方案
左右两边定宽，中间自适应
左右居中
上下垂直居中
scale和zoom有什么区别?为什么scale后还会占空间?
扩展知识
css
常见布局与交互
HTML & CSS & 交互
常见的DOM操作有什么
documen.write和innerHTML的区别?
DOM操作一怎样添加、 移除、移动、复制、创建和查找节点?
DOM
iframe通信
jsonp
window.name
document.domain
代理
postMessage
三个最常用的跨域(面试记这个即可)
四个比较不常见的跨域
讲下JavaScript跨域怎么实现
CORS
跨域
区别
优缺点
轮询和常轮询
websocket和ajax的区别是什么，websocket的应用场景有哪些
websocket
说一下web worker
web中怎么实现会话跟踪?
通信
Cookie、sessionStorage、localStorage的区别
公共问题
cache-control的值有哪些
cache
Cookie如何防范XSS攻击
Cookie和session的区别
localStorage和cookie的区别
sessionstorage
cookie、localStorage、sessionStorage
强缓存
协商缓存
缓存
存储
通信与存储
讲一下什么是渐进增强和优雅降级
浏览器在生成页面的时候，会生成那两颗树？
浏览器从url输入到显示页面的步骤
常见兼容性问题
渲染
你怎么理解浏览器内核
内核
navigate
location
window
几个很实用的BOM属性对象方法
说一下web Quality（无障碍）
api
浏览器
浏览器& DOM
路由hash模式和history模式有什么优缺点?
双向绑定原理？js的proxy有什么作用？和Object.defineProperty()有什么区别
单页应用怎么实现keep-alive
Vue与Angular以及React的区别
框架共性知识
用过dva吗？介绍下redux？什么时候用类组件？什么时候用函数式组件
this.setState是同步还是异步（其实是个bug
类组件
react 为什么不能在for循环if语句里面使用hooks，说下react hooks实现原理
react hook了解哪些？怎么封装useState增加回调？
useMemo和useCallback什么区别
useEffect和componentDidMount有什么区别
hooks
为什么使用函数式组件而不用类组件
函数式组件
每次this.setState都会创建fiber树吗？每个组件都有自己的fiber树吗
fiber是有优先级定义，例如键盘按键触发事件优先级高
在线程方面去做了优化
分片，之前是一气呵成不能被打断，现在是每个子组件都有一个fiber树，所以在计算过程中用户如果有其他操作可以被打断，渲染过程不能被打断。
react fiber
简单介绍下react
单向数据流
react和Vue的原理，区别，亮点，作用
有了解过react的虚拟DOM吗，虚拟DOM是怎么对比的呢
react高阶组件知道吗
react的生命周期
嵌套组件之间的生命周期
生命周期
prop和state
diff原理
fiber
redux
父子
兄弟
爷孙
组件之间的通信
hash模式和history模式
react-router原理
react高阶组件
render props
mixin
什么是JSX
小问题
React
VUE3.0的虚拟DOM本质是什么，diff算法有了解过吗?VUE3的diff算法有什么区别?
对于MVVM的理解
什么是vue生命周期？
vue生命周期的作用是什么？
生命周期总共有几个阶段
第一次页面加载会触发哪几个钩子
DOM 渲染在哪个周期中就已经完成
vue生命周期
Vue实现数据双向绑定的原理
vue中 key 值的作用？
一句话能说明的
对keep-alive 的了解
vue-cli如何新增自定义指令
如何自定义一个过滤器
vue-cli
vuex是什么?用在哪些场景?怎么使用
vuex
组件之间的参数传递
实现vue的双向绑定
什么是mvvm
vuex干什么用的
什么是virtual dom
虚拟DOM & diff算法
vue的优点是什么，缺点是什么
Vue3有了解吗& diff算法有什么区别
性能优化
HOC是什么?相比mixins有什么优点? .
v-if 和 v-show 区别
语法
路由原理
vue路由的钩子函数
Vue的路由实现: hash模式和history模式
$route和$router的区别
路由
组件通信
Vue组件间的参数传递
生命周期钩子函数
NextTick原理
路由、通信、生命周期
vuex是什么？怎么使用？哪种功能场景使用它？
vue实现路由的方式
你对vue的理解到什么程度了?
你知道什么是spa、seo与ssr
vue为什么要求组件模板只能有一个根元素
hash模式和history模式有什么区别
prop和state的区别
常见的vue指令
你知道pwa是什么吗
为什么vue要放弃ES6的class
不同组件之间的嵌套生命周期会怎么样
vue的生命周期
为什么vue3要用proxy代替object.defineProperty
你了解vue的diff算法吗
双向数据绑定
diff原理是什么
diff
vue的双向绑定原理
虚拟DOM
vue-model
vue常见指令
常见问题
Vue 2.0
Proxy与Object.defineProperty的优劣对比
Vue 3.0
Vue
框架问题
怎么使用webpack对项目进行优化？
优化打包速度
loader
Babel原理
如何实现一个插件
减少Webpack打包时间
减少Webpack打包后的文件体积
谈谈对webpack看法
webpack和gulp区别（模块化与流的区别）
有做过性能优化吗?例如webpack优化?webpack打包优化怎么优化?对webpack5了解吗？
dll？热更新原理是什么
webpack
vite实现原理
vite
打包
页面埋点
性能监控
异常监控
埋点与监控
系统构建
懒加载
用web pic 代替jpg
CDN
图片优化
防抖与节流
预加载
预渲染
css优化
如何进行网站优化
js的性能优化有哪些
讲下前端性能优化
怎么看网站的性能如何
实际使用过的前端性能优化的方案，描述下场景并做下介绍
怎么进行性能优化
性能
前端怎么进行测试
jest
单元测试
测试
性能优化 & 测试
工程化
微信小程序和vue的差别
小程序
rem 的适配方案
比较好的解决自适应的方案
适配iphonex
实现自适应
设备列表
border-image/background-image
渐变和阴影
viewport + rem 实现
1px很粗的解决办法
响应式设计是否需要设计师提供多套的设计稿呢?
不重要的
click在ios上有300ms延迟，原因及如何解决？
讲讲viewport和移动端布局
实现原理是什么
react native
week
lonic
flutter
service work
pwa
移动端
大数据页面切换问题
增量排序算法
diff算法问题
逻辑结构设计问题
低代码平台可能面临的问题
二进制存储
加速存储
大数据页面渲染，页面切换怎么优化
做低代码你底层设计的思路是什么
低代码
前端三维渲染
webGL
可视化
融云IM
IM
直播协议
IM & 直播
边界知识
Step3（深度知识
简单实现Node的Events模块
node的使用场景和优缺点
监控 & 性能优化
原生node
koa
express
egg
NODE
Docker & 持续集成
知识区分
服务端知识
Step4（广度知识
精品模板
https://www.processon.com/view/link/60d0bbaa1efad47436c3c5e2
预备知识
0 条评论
回复 删除
下一页
