蚂蚁集团-数字金融线-体验技术部前端一面面经（一面已过）
好久没管这个帖子了顺便更新一手吧，3月29日上午8:37接到来自阿里巴巴的邮件通知已被录用，发放意向书
3月15日18:40更新：兄弟们，我二面也过了
3月14日19:30更新：兄弟们，我一面过了，二面好像是部门主管
昨天晚上面的，面试官 19:00 打了个电话过来，说往我邮箱里发了个链接，让我先做一个小时的笔试题。
笔试 阿里伯乐系统 60min
笔试是在阿里的伯乐系统上做的，三道手撕代码。
第一题、根据表达式计算字母数量
描述：输入一串字符串，根据字符串求出每个字母的数量并返回结果对象。（数字为1时可省略）
示例一：输入：A3B2，输出：{"A": 3, "B": 2}
示例二：输入：A(A(A2B)2)3C2，输出：{"A": 16, "B": 6, "C": 2}
这题我放在最后写了，结果因为被第三题最后一个输出卡了很久只剩下五分钟写这题代码，来不及写了。
第二题、手写节流
描述：参数一：执行的函数，参数二：时间间隔。要求实现即使函数被连续处罚多次也只在连续时间内执行一次。
我一看题面描述立马反应过来用节流，刷刷刷写出来了。
function throttle(func, time) {
let timeout;
return function () {
if (!timeout) {
func.apply(this, arguments);
timeout = setTimeout(() => {
timeout = null;
}, time);
}
};
} 第三题、对象扁平化
输入：
{
a: 'a',
b: [1, { c: true }, [3]],
d: { e: undefined, f: 3 },
g: null,
} 输入用例记不太清了，应该大致差不多吧
输出：
{
a: "a",
b[0]: 1,
b[1].c: true,
b[2][0]: 3,
d.f: 3
// null和undefined直接舍去
} 因为没写过这种代码所以一开始也挺没有头绪的，花了很多时间在这题上面。（代码实现很烂，希望各位大佬不要喷我qwq）
function flatten(obj) {
const res = {};
const _flatten = function (o, prev = null) {
if (Array.isArray(o)) {
for (const index in o) {
const ele = o[index];
if (ele instanceof Object) {
_flatten(ele, `${prev ? prev : ''}[${index}]`);
} else {
if (ele) {
res[`${prev ? prev : ''}[${index}]`] = ele;
}
}
}
return;
}
for (const key in o) {
if (typeof o[key] === 'object') {
if (o[key] !== null) {
_flatten(o[key], `${prev ? prev + '.' : ''}${key}`);
}
} else {
if (o[key] !== undefined) {
res[`${prev ? prev + '.' : ''}${key}`] = o[key];
}
}
}
};
_flatten(obj);
return res;
} 吐槽一下
阿里的伯乐系统在我写代码的时候出问题了，因为面试官说我可以在浏览器的控制台测试代码所以我是全程开着控制台的。结果我写到一半发现控制台一直在报错：WebSocket is already in CLOSING or CLOSED state.
我当时一看人都麻了……不会是这系统觉得我一直在控制台里测试觉得我离线自动断开ws了吧……
一个小时后笔试结束，面试官问我第三题是不是没写完，我就告诉他好像ws断开连接了，他可能看不到我后面的代码了。
最后面试官就让我口述了一下第三题的思路，又问了问我有没有解第一题的思路。我就把两道题的思路说了一下，因为第三题是我已经做出来了的，所以我就解释得比较详细，第一题因为还没怎么做就只讲了基本思路，并且回答了应该使用什么数据结构来处理这道题。
面试 全程电话面 30min
- 解释一下笔试题
- 自我介绍
- 有没有看过React的源码？
我回答说没有看过，但是了解过虚拟DOM和DIFF算法，面试官让我解释一下这两者。 - 根据我的回答，面试官又问了一句为什么在JSX里循环生成DOM需要添加key
我就从DIFF算法的原理特性解释了这个问题 - class组件和使用hooks的组件有什么区别
- 有没有用过iframe？没有用过
- 有做过h5的手机端的页面吗
- 在手机端一般用什么单位？我就说比较喜欢用rem、em、rpx这些，面试官接着又让我解释一下rem
- 现在写代码Promise用的比较多哈，你能解释一下Promise是什么样的一个概念吗？
我解释了一下Promise的主要用途和用法，也同时讲了一下async/await的概念，以及它们和Promise之间的关系。 - 在以往的项目里有遇到什么困难的点吗？
这个问题给我噎住了，一下子想不起来有什么很牛逼的难点，比较基本的不敢答，最后挑了一个现在在做的electron项目的一个小问题的解决办法。并且讲了一下由于项目重构后使用了更新版的electron导致原项目的解决方案不再适用，当时也找不到问题所在，于是通过overstackflow了解到electron这次更新是把我的这部分功能限制了的，而它的中文文档又没有更新，因此得查阅英文文档才能看到更新的细节……后面又想到了目前的解决方式解决了这个问题。
然后问了一下我现在是大几，最后面试官说如果有后续面试会打电话通知我的。
（话说现在还没消息我不会一面就寄了吧）
