一 目录
不折腾的前端，和咸鱼有什么区别
| 目录 |
|---|
| 一 目录 |
| 二 前言 |
| 三 360 |
| 3.1 笔试题 |
| 3.2 面试题 |
| 四 bilibili |
| 4.1 一面 |
| 4.2 二面 |
| 4.3 后续 |
二 前言
返回目录
2020 面试其实不止 2 家，但是一是我偷懒，二是我觉得如果小伙伴将 2020 求职系列认认真真看过了，一面题都不是问题，问题是二面问项目的。
所以希望小伙伴们看完这篇文章后，能审视下自己的项目经验，能不能做更好的提升。
三 360
返回目录
360 是搭高铁过去现场面的，顺带看看内推我的大佬。
3.1 笔试题
返回目录
- 行内元素和块级元素
- CSS 选择器
- 创建、添加、移除、复制 DOM 节点
- 数组
pop()、push()、shift()、unshift()的作用 - 判断变量类型的方法、差异和局限
- 变量提升、函数提升、
Event Loop及var变量污染做打印题 - 数组去重多种方式实现
- 千分位分割数字：
1234567890.11->1,234,567,890.11 - 手写防抖和节流
- 实现柯里化
add(1)(2)(3) - 算法题：
有 N 天未打卡及漏打卡数组 missDays，有 M 张补打卡，总共有 allDays 天，使用补打卡，获得最长连续打卡天数。
例如：
- 输入：
5, [10, 30, 55, 56, 90], 2, 120 - 输出：
65
const getLongest = (M, missDays, N, allDays) => {
};
getLongest(5, [11, 32, 53, 84, 95], 2, 120); // 65解题：
const getLongest = (M, missDays, N, allDays) => {
// 第一部分：求连续天数区间
// 1. 设置连续天数列表
const area = [];
// 2. 设置打卡区间 [0, allDays + 1]
missDays.unshift(0);
missDays.push(allDays + 1);
// 3. 遍历丢失打卡记录，添加连续天数
for (let i = 1; i < missDays.length; i++) {
area.push(missDays[i] - missDays[i - 1] - 1);
}
// 4. 漏打卡 missDays：[0, 11, 32, 53, 84, 95, 121] -> 连续天数 area：[10, 20, 20, 30, 10, 25]
// 第二部分：补打卡 > 漏打卡 快速通道
// 5. 如果补打卡大于漏打卡，直接累加求值
if (N > M) {
return area.reduce((prev, next) => prev + next, 0) + M;
}
// 第三部分：求补打卡后最长连续天数
// 6. 设置最大值
let result = 0;
// 7. 设置当前和
let sum = 0;
// 8. 设置队列
const queue = [];
// 9. 遍历连续区间，连续 N + 1 个数字求和，求最大
for (let i = 0; i < area.length; i++) {
// 10. 如果 queue 队列已经爆满，再添加就溢出，那就边添加边移除元素
if (queue.length === N + 1) {
// 10.1 队列添加一个元素
queue.push(area[i]);
// 10.2 sum 累加，然后减去队列移除的元素
sum += area[i];
const shift = queue.shift();
sum -= shift;
} else {
// 10.3 queue 原始队列
queue.push(area[i]);
// 10.4 sum 原始累加
sum += area[i];
}
// 11. 求连续最大
if (sum > result) {
result = sum;
}
}
// 12. 返回结果（需要加上补打的 2 天）
return result + N;
};
// 漏打卡 missDays：[0, 11, 32, 53, 84, 95, 121]
// 连续天数 area：[10, 20, 20, 30, 10, 25]
console.log(getLongest(5, [11, 32, 53, 84, 95], 2, 120)); // 72
console.log(getLongest(5, [11, 32, 53, 84, 95], 3, 120)); // 88
console.log(getLongest(5, [11, 32, 53, 84, 95], 6, 120)); // 1203.2 面试题
返回目录
- 自我介绍
- CSS 盒子模型
- CSS 样式优先级
- 垂直居中
- 移动端多分辨率适配
- 移动端
1px问题 Cookie、SessionStorage、LocaleStorage- 登录态
Token- 实现动画效果（
setTimeout、requestAnimationFrame） - 手机按钮点击触发哪些事件并详细解释一下（
touchstart->touchmove->touchend->click） - 手机点击事件的监听
- 为什么
FastClick库中在touchend上进行自定义事件，而不是其他事件呢 - 常见 HTTP 状态码，
204和304区别？301和302区别？ - 浏览器同源策略，不同源会怎样？跨域会有什么限制？哪些操作要限制同源？
- 如何实现跨域请求
- 用
CORS进行跨域，简单请求和复杂请求有什么不同？ - 说一下什么是防抖和节流，说一下它们的使用场景。
- 讲一下
Git Flow - 了解过排序算法吗？说一下冒泡排序和快速排序
四 bilibili
返回目录
bilibili 采用的是牛客网面试方式，毕竟是异地。
4.1 一面
返回目录
- 自我介绍
- 前端性能优化
- 浏览器渲染过程
flat()模拟手写实现- GPU 加速
- ……不记得了
4.2 二面
返回目录
- 自我介绍
- HTTP 请求头大致有哪些字段
- HTTPS
- Vue 双向数据绑定
- React Diff 比对详细
- React 等 MV* 优势
- 回流和重绘
- 预加载
- 项目相关（ECharts、微信小程序）
- ……不记得了
4.3 后续
返回目录
二面后凉了。
分析：没回答好，个人比较懵逼。
jsliang 的文档库由 梁峻荣 采用 知识共享 署名-非商业性使用-相同方式共享 4.0 国际 许可协议 进行许可。
基于 https://github.com/LiangJunrong/document-library 上的作品创作。
本许可协议授权之外的使用权限可以从 https://creativecommons.org/licenses/by-nc-sa/2.5/cn/ 处获得。