【25实习】阿里云前端面经

timeline

• 4.8 投简历
• 4.9 测评
• 4.12 一面（挂）
• 4.17 一面
• 4.19 二面
• 4.26 hr面

2024.4.12 阿里巴巴 阿里云 一面

1. 自我介绍
2. 遇到过最大的挑战与困难（发现项目一多几乎每次都会问到这个问题）
3. 对着项目一个个问
4. Vue 和 React 的区别
5. 介绍常见性能指标
6. 介绍一下 SEO
7. 怎么实现 Ajax
8. 除了 SSR 还有什么方式可以提高 SEO
9. 怎么实现 SSR，为什么要在后端起 node 服务
10. 约了一个小时后的笔试

反问：

1. 业务与技术栈（面试官介绍自己负责的业务、部门业务的所有方向）

笔试：

1. 一道 HTML 基础应用题，面了两面已经有点神志不清了，给了半个小时没写完

2024.4.17 阿里巴巴 阿里云 一面

1. 实习里印象深刻的项目
2. 对着项目猛猛问
3. 虚拟滚动列表实现思路
4. 介绍 React 常用 Hook
5. React 函数式组件相较于类组件的优势
6. React 组件间通信方式，ref 怎么用
7. 实习时间

题目一：数组打平

// [1, 2, [3, 4, [5, 6]]] => [1, 2, 3, 4, 5, 6]
function flattrn(arr) {
  return arr.reduce((curr, next) => {
    return Array.isArray(next) ? [...curr, ...flatten(next)] : [...curr, next];
  }, []);
}

题目二：设计存储页面/组件内数据和方法的 JSON 格式，并从 JSON 格式转为页面代码，微信小程序 + React 两种格式（感觉是讲项目的时候面试官没太听懂，现场实现下）

题目三：简单的发布-订阅模式

class EventEmitter {
  events = {};

  emit(type, ...args) {
    const listeners = this.events[type] || [];
    for (const listener of listeners) {
      listener(...args);
    }
  }

  on(type, listener) {
    this.events[type] = this.events[type] || [];
    this.events[type].push(listener);
  }
}

Callback：

1. 遇到过项目中最难的点
2. 写过最复杂的页面
3. 跨表单数据同步怎么做
4. 设计组件的思路
5. 项目中大规模使用的组件更新流程
6. 对大语言模型的了解
7. 平时怎么学前端
8. 最近印象比较深的新技术

2024.4.19 阿里巴巴 阿里云 二面

最初约的 4 月 18 晚上七点面，鸽了一晚上，19 上午打电话道歉 + 约中午 12 点面，又迟到十五分钟

1. 自我介绍最近一年的项目和实习
2. 问项目
3. 怎么设计虚拟滚动
4. 介绍 flex 布局
5. 介绍 JS 里的隐式调用，对象使用双等（==）时触发的方法
6. React 的 Hook 为什么不能放判断语句和循环语句里，怎么解决

题目一：实现increase函数

function increase() {
  let a = 1;
  const obj = {
    valueOf: function () {
      return a++;
    },
  };
  return obj;
}
const a = increase();
const res = a == 1 && a == 2 && a == 3;
console.log(res); // true

题目二：判断循环依赖

// isCylic(window) => true
// const o = {}, o.o = o;
// isCylic(o) => true
// isCylic({}) => false
const isCylic = (o, set = new WeakSet()) => {
  let isCyled = false;
  if (typeof o === "object" && o !== null) {
    if (set.has(o)) {
      return true;
    }
    set.add(o);
    for (const key in o) {
      if (isCylic(o[key], set)) {
        isCyled = true;
        break;
      }
    }
  }
  return isCyled;
};

问了下用 WeakSet 的原因，能否用 Set、数组实现

反问：

1. 部门业务、技术栈
2. 为什么阿里面试没写过算法题（字节出来的力扣应该都刷过）

2024.4.26 阿里巴巴 阿里云 hr 面

1. 自我介绍
2. 读研相关
3. 规划
4. 为什么选择阿里云
5. 前端和 AI 知识的积累

反问：

1. 部门业务

hr通知五月中上旬全部面完后给feedback