覆盖所有面试知识点，送大厂面经一份！

自己项目中一直都是用的开源的xUtils框架，包括BitmapUtils、DbUtils、ViewUtils和HttpUtils四大模块，这四大模块都是项目中比较常用的。最近决定研究一下xUtils的源码，用了这么久总得知道它的实现原理吧。我是先从先从BitmapUtils模块开始的。BitmapUtils和大多数图片加载框架一样，都是基于内存-文件-网络三级缓存。也就是加载图片的时候首先从内存缓存中取，如果没有再从文件缓存中取，如果文件缓存没有取到，就从网络下载图片并且加入内存和文件缓存。

这篇帖子先分析内存缓存是如何实现的。好吧开始进入正题。

面经分享

第一部分是我前端面试的经验总结，第二部分是我认为比较有思考空间的题目

经验总结

一份漂亮的简历，需要包括以下部分（排版由上而下）
- 个人亮点（专精领域，个人博客，开源项目）
- 教育经历（毕业院校，在校经历、荣誉）
- 工作经历（实习）
- 项目经历
- 专业技能
扎实的前端基础，比如你知道
- <meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'/> 作用是什么？
- flex:1 的 1 代表什么？
- Generator 如何抛出错误？
熟悉一门前端框架（React 优先）
勤刷 LeetCode 的算法题，熟悉掌握相应的数据结构如常见的链表、栈、队列、哈希表、树
熟悉网络基础、Git 命令、Linux 命令
多去了解前端的新趋势（Flutter，PWA，Serveless，GraphQL，CSS Houdini）
要有自信，让面试官感受到你对前端的热爱

面试题

由于面试的公司和次数略多，老生常谈的面试题就不放出来了，也不按公司划分面试题了

算法题

大多出自 LeetCode ，LeetCode HOT 100，最好自己过一遍，理解最优解

编程题

用 Class 实现 EventEmitter，要求拥有 on，once，emit，off 方法
实现 deepClone，要求能成功克隆带有循环引用的对象
CSS 实现一个宽度为浏览器1/2，宽高比为 2:1 的盒子

实现 sum 函数

sum(1)(2)(3) == 6; // true
sum(1, 2, 3) == 6; // true
复制代码

实现 sum2 函数

console.log(sum2(1)(2)(3)()) // 6
console.log(sum2(1, 2, 3)()); // 6
复制代码

用尾递归实现 fibonacci 数列
实现 co 函数
实现以下功能，当对一个 arr 做 push 操作时，会自动打印一行提示消息
```
const arr = [1,2,3];
arr.push(4);
// arr pushed a new element: 4
复制代码
```
代码实现中断 Promise 的运行
有一组图片，实现后一张图片必须等到上一张图片加载完毕，才能开始加载

为 Test 类添加方法，打印指定内容

class Test {constructor() {this.person = { name: "jack", age: 38, position: "CTO" };}// ......
}const test = new Test();
for (const ele of test) {console.log(ele);
}
// [ 'name', 'jack' ]
// [ 'age', 38 ]
// [ 'position', 'CTO' ]
复制代码

实现 handler 函数，遇到 b 和 ac 都要去除

console.log(handler("aabaa")); // 'aaaa'
console.log(handler("abaccbc")); // 'c'
console.log(handler("aaccc")); // 'c'
console.log(handler("aaabccc")); // ''
复制代码

实现 decode 函数

decode('HG[3|B[2|CA]]F') === 'HGBCACABCACABCACAF' // true
复制代码

实现 _bind 函数，使打印 success

function Animal(name, color) {this.name = name;this.color = color;
}
Animal.prototype.say = function() {return `I'm a ${this.color} ${this.name}`;
};
const Cat = Animal._bind(null, "cat");
const cat = new Cat("white");
if (cat.say() === "I'm a white cat" &&cat instanceof Cat &&cat instanceof Animal
) {console.log("success");
}
复制代码

CSS 实现圆环进度条效果

说出以下打印内容

console.log(-1 >>> 32); 
console.log(-1 << 32);
console.log(1 >> 32);
console.log(5 >>> 2);var a = { n: 1 };
var b = a;
a.x = a = { n: 2 };
console.log(a.x);
console.log(b.x);
复制代码