大家好，我是山月。这是我在 B 站的第48场模拟面试

本次的候选人大二，对于项目已经做了多个，刚开始问了一些项目问题，及项目的工程化建设。

关于项目的选项，用了诸多现代化技术，比如 pinia、vite 等，还有 unplugin-auto-import 的一个小优化。

大二能做了这么多，自驱能力想必很强，问及原理时，却了解不足，略有遗憾。随后又问了些 HTTP、XSS 的八股文，也略有不足。

然而此时才大二，突击一个月，找个实习应无问题。离毕业还有两年时间，项目深入及八股逐步完善，再加上两年的实习，去个中大厂也有极大可能。

建议接下来做两件事情:

1. 通读 vite/vue 等官方文档
2. 熟练八股文
3. 对项目相关技术栈进一步深入原理

视频版: 大专大二前端面经实录，关于脚手架的搭建及 HTTP、XSS 等八股文，期望一个暑假实习

以下是简历大致内容:

山月的面试问题记录

• 脚手架
  • 权限菜单
  • 移动端适配
  • 权限菜单的实现
    • routes
    • permission
    • 后台管理系统权限问题: vvbin.cn/doc-next/gu…
  • toastEditor -> markdown editor
  • unplugin-auto-import
    • github.com/antfu/unplu…
    • 按需自动导入/Vite, Webpack, Rollup 都可以用
  • mock
    • vite
  • 分块打包的策略
    • PS: 他的意思是 external，但是山月觉得它第一放在他人CDN容易出问题，第二，即使放在公司CDN版本不好维护，第三，CDN 上该库 cjs/esm 如何用？
    • PS: 这里也可以看看他人对此的论述 panjiachen.github.io/vue-element…
    • 分包策略: shanyue.tech/frontend-en…
    • 分包策略: q.shanyue.tech/engineering…
    • webpack -> splitChunks
    • rollup -> output.manualChunks
      • 文档: rollupjs.org/guide/en/#o…
• 博客
  • local
  • becrypt
  • jwt
    • header/payload/sign ❎
      • jwt.io/
• vite
  • hmr 很快
  • esm 模块
  • 依赖预构建 ❎
  • 依赖预构建: cn.vitejs.dev/guide/dep-p…
• 强缓存和协商缓存的区别 ❎
  • Cache-Control: max-age=3600
• app.xxx.js ❎
  • 为啥要带个hash 值: shanyue.tech/frontend-en…
• pinia
• vue3/vue2
  • vDom
  • div{hello}
• 100个数组为1
• 如何实现一个异步的 sleep
• 如何实现跨域
  • cors
  • nginx
• 如何中断请求 ❎
  • AbortControl
  • github.com/shfshanyue/…
• 如何预防 XSS ❎
  • CSP
  • 转义
  • q.shanyue.tech/base/http/2…

候选人的面经

这一次的模拟面试给我的体验就是沉重的一击，本来觉得前端还可以的我经历了这一次面试之后感觉自己的前端水平还是差的远了，不过也更加的激励我接下来的继续学习，找一份公司实习来提升自己的前端技术把。

其次感觉面试官水平非常的高，关于我没有回答上的问题基本上都有解答，也非常感觉面试官帮我总结下来的问题以及回答有问题的内容，感觉自己薄弱的部分主要一方面是前端工程化（webpack与vite），还有就是关于网络请求方面等等还有很多很多不足的地方，接下来我会继续努力的

具体没有回答上的问题如下：

1. 脚手架菜单权限控制，自我感觉回答的不行 ❎

参考：vvbin.cn/doc-next/gu…

2. 分块打包理解错误，实际分块打包是将过大的文件进行拆分，过于零散的文件进行合并，公用的代码逻辑拆分成块，防止重复打包 ❎

参考：q.shanyue.tech/engineering…

3. jsonwebtoken回答理解有误，间隔时间较长，记忆有些模糊，忘记具体实现以及核心理念了 ❎

参考：juejin.cn/post/693114…

4. 关于强缓存与协商缓存（没有听过）❎

参考：juejin.cn/search?quer…

5. vue3对于vue3有哪些变动优化？（虚拟dom没有深入了解） ❎

参考：juejin.cn/post/684490…

6. 如何中断请求？（听说过但是没有深入了解）❎

参考：juejin.cn/post/703390…

7. 如何预防XSS攻击？（听说过但是没深入了解）❎

参考：juejin.cn/post/704618…

字幕

可对照字幕与视频进行快速浏览:

见 q.shanyue.tech/mock/220528…

本次面试记录将收集在我的网站模拟面试系列中，其中收集了我所有的模拟面试记录及如何预约面试。

模拟面试系列

既然看到最后了，欢迎点赞、在看与转发，帮助需要面试的同学先来检测下自己的能力。