前言

时间线：8月20日投递简历，9月7日面试官打电话约面，9月16日晚上面试。

部门：阿里巴巴 - 本地生活 - 饿了么 - 商家端。

一面

做题+聊天，全程100分钟。

做题

先做五道题，给20~30分钟的时间。

1. 列出打印顺序

// 列出打印顺序
function changeStuff(a, b, c) {
  a = a * 10;
  b.item = "changed";
  c = {item: "changed"};
}

let num = 10;
let obj1 = {item: "unchanged"};
let obj2 = {item: "unchanged"};

changeStuff(num, obj1, obj2);

console.log(num);
console.log(obj1.item);
console.log(obj2.item);

2. 数组扁平化

// 数组扁平化
const arr = [1, 2, [3, 4, [5, 6, [7]], [8], [9], 10], 11];

3. JS 手写快排

// JS 手写快排
const arr = [3, 2, 5, 4, 8, 3, 9, 3, 5, 2, 1, 6];

4. 手动实现new操作符

// 手动实现new操作符
let Parent = function (name, age) {
  this.name = name;
  this.age = age;
};
Parent.prototype.sayName = function () {
  console.log(this.name);
};

const child = new Parent('xxx', 0);
child.sayName();

5. JS 实现洋葱模型

// JS 实现洋葱模型
async function mid1(next) {
    console.log(1);
    await next();
    console.log(4);
}

async function mid2(next) {
    console.log(2);
    await next();
    console.log(5);
}

async function mid3(next) {
    console.log(3);
    await next();
    console.log(6);
}

const middleware = [mid1, mid2, mid3];
compose(middleware)();

聊天

1. 自我介绍
2. 说一下实习项目吧
3. 说说对跨端的理解
4. 微信小程序了解多少
5. RN 中的 H5 如何与原生通信
6. H5 页面如何保存原生的登陆态
7. 这种登陆态和 Web 的有什么区别
8. 说说对 Hybrid 的理解
9. JSBridge 背后的原理是什么
10. JS 为什么能调用原生方法
11. 对跨端编译了解多少
12. 抓包工具背后的原理是什么
13. 说说对前端监控的理解
14. 你是如何设计埋点 SDK 的
15. 说说 Babel 的工作流程
16. 挑一个你写过的 Babel 插件，说说实现思路
17. 说说对 TS 的理解
18. 即使没有执行，TS 也能提示类型错误，这背后的原理是什么
19. AST 还有哪些应用场景
20. 你知道哪些性能指标
21. TTI 的计算规则
22. 你有实践过哪些性能优化
23. 提升页面秒开率的手段有哪些
24. 如何解决长列表渲染问题
25. 接口请求耗时过长怎么办
26. 如果我想用缓存解决上述问题，该如何让前端展示最新数据
27. 实现一个自定义 Hook，根据缓存和请求接口，展示最新的数据
28. 洋葱模型是如何用于请求拦截的
29. 函数式组件和类组件有什么区别
30. 为什么说函数式组件是一种趋势
31. 函数式组件和类组件在编译后哪个更大
32. 它们的编译产物还有什么区别
33. 实现一个带装饰器的高阶组件
34. useMemo 和 useCallback 的区别
35. 说下你理解的闭包陷阱
36. 说下 webpack 和 vite 的区别
37. 如何加快 webpack 的打包速度
38. include 和 exclude 的使用场景
39. 如何对 node_modules 中的某个 npm 包进行编译
40. webpack 的分包策略有了解吗
41. 多个 entry 的应用还是 SPA 吗
42. 在打包过程中，如何对多页面应用进行缓存
43. Tree Shaking 背后的原理
44. 为什么原型链上的属性无法被 shaking
45. sideEffects 有什么作用
46. 说说对事件代理的理解
47. Promise 背后的原理是什么
48. 说一下 V8 垃圾回收机制
49. 哪些情况会造成内存泄漏
50. 反问环节

总结

第一次面阿里，虽然一面完就挂了，但不得不说，体验非常好。

面试官会很耐心地向你解释一些技术的使用场景和背后原理，并引导你思考。

无奈技术实力差距太大，不能和面试官做到有来有回地互动。

反问环节，问了面试官一些职业发展的问题，也收获了一些启发。

最近在前端的学习上也确实遇到了瓶颈，希望自己可以继续努力吧。