2024年最全本来是想试试水，没想到五轮面试后真的面上了阿里前端岗(3)，算法面试宝典

前端框架

前端框架太多了，真的学不动了，别慌，其实对于前端的三大马车，Angular、React、Vue 只要把其中一种框架学明白，底层原理实现，其他两个学起来不会很吃力，这也取决于你以后就职的公司要求你会哪一个框架了，当然，会的越多越好，但是往往每个人的时间是有限的，对于自学的学生，或者即将面试找工作的人，当然要选择一门框架深挖原理。

以 Vue 为例，我整理了如下的面试题。

如果你觉得对你有帮助，可以戳这里获取：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

• 了解我们的产品吗？我提前 google 了团队的业务项目，之前也看过一些类似产品的文章，我结合自己的项目经验，说了一点理解，就几句话。

• 你想问什么？我问了本次的表现，了解了一些团队项目的工作内容、项目招人的背景、对于后续面试该做什么准备。一面没碰到手写题，都是很基础的问题，整体相对轻松。

二面 (60min)

---

晚上 9 点半的面试，面试官应该刚忙完，上来直接问业务，全程业务……权限页面的细节：

• 各个模块、按钮怎么设计权限；

• 分角色、分地域怎么设计？

• 要加个表头，还要控制展示的顺序，在各个浏览器表现一致，怎么设计？说出所有方案，想到什么自由发挥了……

• 聊到本地存储，问：localStorage 在各浏览器、移动端浏览器的 size 一致吗？

其他：

• 这一段是我简历的项目，略过……

• 继续聊阿里的产品，简单使用后，请提出几个可以优化的地方？

• 啥也没透露，让你预测下这款产品的接下来的方向，如果是你，你会着手哪个方向，并且凭啥让你来干，说下你擅长的……

• 正式讨论产品，大家都在做什么，团队协作的情况，公布接下来的迭代方向，针对的人群，目标……

• 照例闲聊，拜拜。

插曲：中间出现两次突然挂机，当时我的感觉就像过山车，从高空滑向低谷，整个心都是 ——某可爱漂亮的

央视记者—— 的。

三面 (60min)

---

这一面是笔试，哈哈，我复习了很多手写题，结果是完全与三面的考题完美岔开，没有交集，emmm……，好在并不难……题一：

/**

• 1.计算多个区间的交集

• 区间用长度为2的数字数组表示，如[2, 5]表示区间2到5（包括2和5）；

• 区间不限定方向，如[5, 2]等同于[2, 5]；

• 实现getIntersection 函数

• 可接收多个区间，并返回所有区间的交集（用区间表示），如空集用null表示

• 示例：

• getIntersection([5, 2], [4, 9], [3, 6]); // [4, 5]

• getIntersection([1, 7], [8, 9]); // null

*/

题二：

/**

• 2.DOM 的体积过大会影响页面性能，假如你想在用户关闭页面时统计（计算并反馈给服务器）

当前页面中元素节点的数量总和、元素节点的最大嵌套深度以及最大子元素个数，请用 JS 配合

原生 DOM API 实现该需求（不用考虑陈旧浏览器以及在现代浏览器中的兼容性，可以使用任意

浏览器的最新特性；不用考虑 shadow DOM）。比如在如下页面中运行后：

*/

f

o

o

// 会输出：

{

totalElementsCount: 7,

maxDOMTreeDepth: 4,

maxChildrenCount: 3

}

题三：

// 3.请使用原生代码实现一个Events模块，可以实现自定义事件的订阅、触发、移除功能

/*

const fn1 = (… args)=>console.log(‘I want sleep1’, … args)

const fn2 = (… args)=>console.log(‘I want sleep2’, … args)

const event = new Events();

event.on(‘sleep’, fn1, 1, 2, 3);

event.on(‘sleep’, fn2, 1, 2, 3);

event.fire(‘sleep’, 4, 5, 6);

// I want sleep1 1 2 3 4 5 6

// I want sleep2 1 2 3 4 5 6

event.off(‘sleep’, fn1);

event.once(‘sleep’, ()=>console.log('I want sleep));

event.fire(‘sleep’);

*/

业务四面 (35 min)

---

周末，人在梦游，刚下航母，就激灵灵接到电话，人还是糊的……

• 跨端的原理？我讲了几个例子：taro、uni-app，顺便提了 flutter、react native、小程序等的架构，具体怎么设计的。

• 动态表单能够运用在什么场景？我举了 7、8 个例子。

• 移动端适配相关的问题，应用场景。

• 我公司的业务讨论，是否了解过竞品等等，这里略过。

hr 五面 (60 min)

---

• 对于你项目的竞品有了解吗？说一下

• 你的项目与竞品相比，好在哪里，有什么优势？

• 下班后都在做什么，问的都是过往经历，问的太详细了，让人不舒服。

• 如果与同事发生了意见的不一致，你会如何解决呢

• 现在针对我们的业务，急需增加一个新的模块位置，你会怎么设计？数据怎么展示……

• 没错，hr 还问技术相关的问题。

整体感受

---

总体面下来没有让人紧张的感觉，中规中矩，从刚开始较高的心理预期到后面慢慢回落……由于我的水平有限，最终没有争取到多高的薪水。

文末

从转行到现在，差不多两年的时间，虽不能和大佬相比，但也是学了很多东西。我个人在学习的过程中，习惯简单做做笔记，方便自己复习的时候能够快速理解，现在将自己的笔记分享出来，和大家共同学习。

个人将这段时间所学的知识，分为三个阶段：

第一阶段：HTML&CSS&JavaScript基础

第二阶段:移动端开发技术

第三阶段:前端常用框架

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

• 推荐学习方式：针对某个知识点，可以先简单过一下我的笔记，如果理解，那是最好，可以帮助快速解决问题；

• 大厂的面试难在，针对一个基础知识点，比如JS的事件循环机制，不会上来就问概念，而是换个角度，从题目入手，看你是否真正掌握。所以对于概念的理解真的很重要。