大家好，我是雷布斯。
很久没有给大家分享面经了，咱们今天就来学习下，一位3年工作经验的海归同学，她的社招面试经验。
一、背景
先来简单介绍下这篇面经的背景。
这位同学是是第一批参与我们辅导的同学，她当时参加的是简历辅导，我们针对修改后的简历，提出了不少复习建议。
这位同学大四就去法国交流一年，之后直接在法国读的硕士，毕业后就在国外的一家旅游公司做前端开发。
无论从学历、工作经验、还是技术能力上，这都是一位很优秀的同学，执行力和学习能力都很强，她的意向城市是上海或者杭州。
二、面试总结
下面就直接进入她的面试总结。
7月中旬到8月中旬，我面试了多家公司，有大厂、中厂、外企、初创、外包，面试风格各不相同。
2.1、考察方向
先列举一下各家公司喜欢考察的方向：
- 算法
人工智能相关的公司很喜欢考算法，对算法要求也高。有的公司会在最后出个简单的算法题，说出思路就给过了，也有完全不问算法的。
- 八股文
大部分公司还是会考八股文的
- 场景题
半数出现几率，主管会根据真实碰到的问题来询问你的解决方案，没有经验很难答好
- 判断题
少于半数出现，根据一段代码说出输出，说出如何修改代码来实现预期输出
- 编程题
少于半数出现，根据题目要求编写函数
- 作业题
较少出现，发送一道编程题限时1天内提交工程源码，可能是一个页面的实现或者类的实现
- 英语
外企大多使用英语描述题目和需求
2.2、面试方式
不同公司的面试风格和方式都不太一样，我经历过以下几种：
- 从简历里项目开始聊，徐徐渐进每个知识点，延伸至相关问题的解决方法
- 面试官之前完全没有阅读过简历
- 要求候选人介绍技术背景、最有成就感的项目，临时根据这些信息来提问
- 完全抛开简历，直接问有没有用过这个，原理是什么
- 一上来就要求做个算法题，不过直接88
三、面试题
3.1 JS
- 原型链（改变原型上的值）
- let const，var 变量提升
- 如何实现深拷贝
- 操作 dom 节点（dom.querySelect）
- 箭头函数
- 数据类型
- 循环数组（for 循环的优点）
- map forEach 的区别
- map函数和filter函数
- 模版字符串
- reduce
- 如何解决精度问题
- 0.1+ 0.2 === 0.3
- 如何将 0.2 转换成二进制
- undefined 和 null 的区别
- 变量未声明和未定义的区别
- event loop
- 浏览器缓存
3.2 CSS
- position 的 relative absolute
- display 常用的值
- 盒子模型
- margin 折叠
- 如何清除浮动
- css 选择器有哪些，> +
- 微信小程序 rpx 的样式换算规则
- 小程序设计图的推荐尺寸
3.3 网络
- 用的 http 请求头
- GET POST 在跨域请求时有什么区别
- 三次握手四次挥手
- TCP 和 UDP 区别
- HTTP 和 RTMP 区别
- HTTP 是单向连接还是双向连接的
- 程序运行中进行 http 请求是在单独的线程吗
- 跨域 cros
- 强缓存和协商缓存
3.4 React
- 更新组件的生命周期
- 挂载组件的生命周期
- useEffect 模拟的生命周期
- react hooks 只执行一次 ajax 请求
- useCallback 什么情况下包裹函数，有多个 state 时会不会执行多次
- react 中 setTimeout 的回调中执行 setState()
- 怎么防止组件的重新渲染
- 组件渲染的逻辑，diff 算法，层级不能过深
- react redux 的伪代码
- 有没有看过源码
- react 的原生 api
3.5 场景题
- 如何生成一个海报
- 如何实现图片的懒加载
- 如何渲染长列表
- 白屏可能的原因
- git操作，clone，rebase，merge，stash，cherry-pick
- 如何判断设备是 PC Mobile
- 多个http请求后执行操作
- 如何控制 input 的输入个数
- 如何控制 input 输入 中文和英文的个数
- 用户连续点击提交
- 中奖概率使用 Math.random() 会有什么问题
- 一个滚动公告组件，如何在鼠标滑入时停止播放，在鼠标离开时继续等待滑入时的剩余等待时间后播放
3.6 算法
- 只出现一次的数字
- 层序遍历二叉树
- 遍历2个链表，遇到相同的可以相互跳转，计算最大值
- 返回二叉树，一层一个数组
3.7 判断题
- for 循环 let 和 var 的区别，内部有 setTimeout 会是最后一次 i++ 没通过判断的值
- async 函数执行时的错误返回会不会被同步代码捕获
- redux 的一个 reducer 函数（不能执行副作用）
- 函数参数的默认值和解构赋值语法
- 闭包函数返回2个函数，返回同一个私有变量
3.8 编程题
- 低代码，将 json 还原为 dom 节点
- await 后执行一个等待函数，实现函数的暂停
- 正则表达式筛选出数组中只包含大小写字母的字符串，并将结果转换成大写
- 编写计时器
- 根据身高，体重，身高差排序学生数组
- 九宫格输入法
- 范围列表 rangeList
- 展开多维数组
3.9 其他
- 原生ajax请求
- 伪装攻击 csrf
- webSocket 的安全策略
- 前端性能怎么优化
- 自动埋点
- TS 定义类型
- 有没有看过其他开源项目
- webpack 使用过的插件和loader
- 项目属于 BS 还是 CS 架构，什么时候被称为 CS
- 有H5公众号网页为什么还要做微信小程序
四、总结
这位同学经过一个月的面试，最终是收获了心仪的offer。
今年的就业行情不好，这位同学在找工作之初，也是有些焦虑，在找了一些小公司练手，找回了面试状态，后面的面试也发挥的很不错。
回顾整个面试题目，我觉得最考察人的，还是场景题，这也是很多中大厂喜欢的面试方式：给你一个场景，让你提出解决方案，对个人的技术能力和视野都能进行较好的考察。
比如上面有一个题，区分用户的访问设备，可能大部分的人都只能答出 navigator.userAgent，但如果你能回答更多的方法，是可以给面试官留下更好的印象。
再给“前端面试题宝典”的辅导服务打下广告，目前有面试全流程辅导、简历指导和模拟面试的增值服务，如果有感兴趣的伙伴，可以联系小助手（微信号：interview-fe）了解详情哦~
文章首发于微信公众号：”前端面试题宝典“，原文地址请戳这儿，可直接通过微信链接查看对应的题目答案。
