【前端校招面经】字节跳动2023前端校招一面凉经

base: bj
岗位: 前端
实际上岗位是发在社招上的, 但我看任职要求里没有要求工作年限, 我就投了

八股文:

• 自我介绍
• 介绍 CDN 原理
• 介绍 https 和 http 的区别
• 介绍 https 握手过程
• https 协议需要基于 http/2.0 吗?
• 介绍中间人攻击, https 能绝对安全吗? 能够绝对避免中间人攻击吗?
• 浏览器从输入 url 到显示网页的全过程
• 上述过程中, 有哪些前端可以做的性能优化点
• 看 Promise 代码说结果:

const a = new Promise((resolve, reject) => {
  resolve(1);
  console.log(2);
  setTimeout(() => {
    reject(3);
  });
});
a.then(data => {
  console.log(data);
}, error => {
  console.log(error);
});

代码题

• 假设有 3 个 js 模块a, b, c, 这三个模块都使用 ES Module 语法声明依赖关系. 要求写一个算法, 判断三个模块之间有没有循环依赖(如 a import b, b import c, c import a)

我当时拿到这个题目非常紧张, 所以写出了下面非常 low 的实现, 虽然可以跑通, 但并不是最优解

interface Module {
  name: string;
  imports?: Module[];
}

const moduleC: Module = {
  name: 'moduleC'
};

const moduleB: Module = {
  name: 'moduleB',
  imports: [moduleC]
};

const moduleA: Module = {
  name: 'moduleA',
  imports: [moduleB]
};

/**
 * 检查一个模块内部是否有循环引用现象
 * @param module 要检查的模块
 * @returns true 表示有循环引用, false 表示无循环引用
 */
function checkCircleImport(module: Module, dir: string[] = []): boolean {
  if (!module.imports && dir.length === 0) {
    return false;
  }

  if (!module.imports) {
    const targetDir = dir.find((i) => i === module.name);
    return !!targetDir;
  }

  const results = module.imports.map((module) => checkCircleImport(module, [...dir, module.name]));
  return results.every((flag) => flag === false);
}

// test:
const res = checkCircleImport(moduleA);
console.log(res);

• 手写最大并发请求数控制:

function fn(tasks, maxCount) {
  // write code here
}

// test:
(async () => {
  const results = await fn([fetch1, fetch2, fetch3, fetch4], 2);
  console.log(results); // [1, 2, 3, 4]
})();