站酷一二面-前端
站酷整体面下来很累，也很爽。
二面完无后续。HR说最近技术很忙，还没评估，后续会通知。感觉自己表现还可以，蹲一个结果。
发现一个问题，就是我的电脑字体太小，共享屏幕的时候面试官看着都费劲。以后可以适当放大编辑器的字体
一面
10月12日 50min 感觉站酷的面试官可以的 👌
自我介绍
项目
- 介绍一下项目，技术栈、实现都可以讲
- 什么是SSG
- SSR优势
- 官网网页怎么部署的
- 什么是react hooks，干什么的（像看看你到底会不会React）
- useEffect实现了类组件的哪些生命周期 3个
- useEffect第二个参数是对象，会更新吗
前端基础
- css垂直水平居中
- 性能优化有哪些 冲！
- 什么是useMemo, useCallBack
- tree shaking原理 （esm静态编译，AST）
- http2新特性 冲！
- http2 server push和websocket
- http3 基于什么
- TCP三次握手
- 两次握手行吗
- 四次挥手
代码题
- 写快排
function quickSort(arr) {
if (arr.length <= 1) return arr;
let length = arr.length;
const middleIndex = Math.floor(length / 2);
const middle = arr[middleIndex];
const left = [],
right = [];
for (let i = 0; i < length; i++) {
if (i === middleIndex) continue;
if (arr[i] > middle) right.push(arr[i]);
else left.push(arr[i]);
}
return [...quickSort(left), middle, ...quickSort(right)];
}
console.log(quickSort([1, 4, 2, 8, 5])); - 全排列 ----全军覆没
- Promise.race
Promise.myRace = function (promises) {
return new Promise((resolve, reject) => {
promises.forEach((promise) => {
promise
.then((res) => {
resolve(res);
})
.catch((e) => {
reject(e);
});
});
});
}; - custom hook获取浏览器视口宽度
import { useEffect, useState } from "react";
export function useWindowWidth() {
const [width, setWidth] = useState(window.innerWidth);
const onWindowResize = () => {
setWidth(window.innerWidth);
};
useEffect(() => {
window.addEventListener("resize", onWindowResize);
}, []);
return width;
}
反问：
- 业务
- 聊到了低代码，搞定设计
- server push
- tree-shaking esm问题 哈哈哈感觉面试官应该不是科班
二面
二面压力很大，也很爽。50min
面试官说我不回应人家哈哈哈，以后面试注意，活泼一点。
- 小程序
- 项目：怎么实现ssr的
- 详细介绍一下，重点是怎么做的 （灵魂问题，完蛋了）
- renderToString具体是怎么实现的
- JSX渲染原理 _jsx函数在 react/runtime下好像
- 虚拟DOM
- DIFF算法实现，由哪些算法实现
- 如果让你来实现diff算法
- 数据结构怎么样（因为diff答得不好）
- 路由匹配 精准匹配、模糊匹配
- 什么是SSG
- SEO优化做了哪些
- 搜索引擎基本原理，收录规则，Google Bing Baidu有什么区别 （我不知道，没调研过）
- 说我做的SEO优化太浅了
- 第一次被diss music项目烂大街 hhhh，你这个项目跟别的有什么区别吗？
- 二叉树中序遍历 hhh
- 算法题，leetcode原题
// [1, 3, 4] 5
function func(target, arr) {
let map = new Map()
let res = []
for (let i = 0; i < arr.length; i++) {
let another = target - arr[i]
if (map.has(another)) {
let index = map.get(another)
res.push([i, index])
} else {
map.set(arr[i], i)
}
}
console.log(res)
}
func(4, [1, 3, 4]) - 实现Promise.AllSettled
下面的代码，有问题。网上的代码并没有区分先后顺序，这是改进后的。但是仍然需要改进什么时候resolve，目前还没有想到完美的方案。
Promise.IAllSettled = (promises) => {
let res = new Array(promises.length).fill({});
return new Promise((resolve, reject) => {
promises.forEach((promise, i) => {
promise.then(
(res) => {
res[i] = { value: res, status: "fulfilled" };
if (res.length === promises.length) resolve(res);
},
(error) => {
res[i] = { reason: error, status: "rejected" };
if (res.length === promises.length) resolve(res);
}
);
});
});
}; - Map时间复杂度，什么顺序 ？ 我说是添加的顺序，Map数据结构有待研究
- 有其他offer吗
- 期望找一个什么样的实习
- 对大厂小厂有什么倾向 （谁不想去大厂
- 爱好，哪里人
- 可以出校实习吗，可以实习多久，什么时候开始
反问：
- 问面试官在公司怎么做SEO，针对不同的搜索引擎做专门的适配
- SEO是前端的事吗
- Map有序吗，跟引擎有关，版本不同，有差异
- 对象到底是不是有序的
- 虚拟DOM
