站酷一二面-前端
站酷整体面下来很累,也很爽。
二面完无后续。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