2022 信也科技（23届秋招）消费场景前端一二三面面经

信也科技前端面经也太少了，就让我来补充一点吧（好像信也科技的前身是拍拍贷，这个公司出名一些，搜这个的面经会多些）

一面

日期：2022/11/7

1. 自我介绍
2. 如何去做的移动端的适配？
3. rem 是如何做的适配？如何设置的 font-size 大小？
4. 有没有了解过其它的适配方案？（我说了阿里的 amfe-flexible 和 postcss-pxtorem 方案，以及设置 <meta name="viewport" content="_width=_device-width, initial-scale=1.0"> 的两种方式）
5. 有没有了解过 vw 和 vh 的适配方式
6. 介绍一下实习里面虚拟列表的实现
7. 如何计算十万级数据加载的时间？（使用 Vue-devtool 这个插件自带的渲染时间计算）
8. 这个时间还可以再优化吗？（我简历的效果是 2-3s，通常情况下 100-200ms 内还算可以接受，面试官觉得优化后的渲染时间还是过于长了）
9. 为什么不选择分页或者前端分页代替虚拟列表来时目录树呢？
10. 如何实现一个分页器？比如有 10 页，默认显示存在 3 页可点击，类似下面的效果

< 1, ..., 9, 10 >

11. 项目里面有 Native 项目的经验，那有没有使用过 prompt 去实现 H5 和 Native 的交互？
12. 介绍一下防抖和节流
13. 介绍一下有哪些方式去实现跨域
14. 你说的上面的跨域方法在部署方面哪个更好一点？（我回答的 Nginx）
15. 为什么是 Nginx？只是因为可以不用麻烦后端吗？后端使用 CORS 其实也不麻烦，添加一个请求头也是非常快的
16. 跨域上 Nginx 和 CORS 在安全角度上 Nginx 的优势（面试官明示了 Nginx 相对于 CORS 真正的优势其实是在于安全）
17. 你说你实际部署过网站，那么对 nginx.conf 的代理配置中，下面的两种写法有什么不同？（我太菜了，这个都不懂，面试官后来介绍涉及到实际请求 URL 的重写问题，具体请参考这篇文章 - Nginx中proxy_pass末尾带斜杠/和不带的区别）

## 第一种写法
server {
  location A {
    proxy_pass B;
  }
}
## 第二种写法
server {
  location A {
    proxy_pass B/;
  }
}

18. 说一下你了解的常见的前端性能优化
19. 你有了解过哪些 loader/plugin，我只讲了几个，像这个八股我每次碰到都不知道讲什么好，查了一下好像也没有好的总结，不知道面试官想要根据这个考察什么呢？
20. 介绍一下你了解的跨端交互的方式（我使用的是 JS 的 API，就是 JavascriptInterface）
21. 介绍一下 Vue 的 diff 算法
22. diff 算法在增删改一个节点时，具体是怎么实现的？（这个问题仿佛一下子打中了我的七寸，我其实对 Vue 的 diff 算法的了解是一个半桶水 /(ㄒoㄒ)/~~）
23. 介绍一下 Vue 的兄弟/父子/祖孙组件的通信方式
24. 如何实现 vuex 的持久化存储，保证页面在刷新后也能够获取到 vuex 的数据
25. 如果让你从新规划一个项目，你会如何去做呢？可以分为，项目开发层面，提交层面，部署层面（其实面试官想考察开发层面如何去做，比如网络请求的配置，axios 的请求响应拦截，项目文件目录的制定规范，我说了太多项目的规范部分）
26. 看了一下你的掘金博客，里面有写一些 Web 安全，能介绍一下吗？（我简单讲了一下 CSRF/XSS，忘记讲 HTTPS 了， /(ㄒoㄒ)/~~）
27. 常用的 CSS 父子盒子水平垂直居中的方案有哪些？
28. 学校应该是教 Java 比较多，所以为什么会选择前端呢？
29. 你对未来的发展是如何规划的？（别问，问就是走全栈）
30. 反问
    1. 您认为 to C 和 to B 的前端开发有什么区别吗？
    2. 面试官看过我写的垃圾博客还是挺用心的，所以就问了下他，觉得对于程序员写博客能够有什么好处

总结一面，非常有经验的前端开发工程师，在开发和部署层面都非常有经验，能够给出相应的正向反馈，对于候选人不会的和回答错误的，会给出纠正和答案，非常的🐂，而且对于反问的问题回答的也很详细

二面

日期：2022/11/8

1. 自我介绍、实习介绍和项目介绍
2. 你觉得你的专业在培养什么的工程师？
3. 专业应该接触 Java 和 C 语言比较多，为什么会选择前端呢？
4. 什么时候开始接触的前端？
5. 两端实习经历有没有什么难点？（深挖项目，面试官会根据你对难点的解决方案点评，并给出他作为一个前辈的经验角度来说比较标准的解决方案应该是怎样的，所以接下来的问题都是根据我的实习经历的难点给出，参考意义不大）
6. 对于目录树的渲染优化为什么不去做分页？反而是选择了虚拟列表？
   1. 虚拟列表快速滑动时，是否有白屏现象，如何解决？
   2. 为什么后端不能分页？如果只能一次性拿到整个目录树，也可以在缓存，比如基于 Redis 缓存去做分页，技术也是可行的，是不是和后端的沟通存在问题？
   3. 目录树的解决应该使用长列表分页而不是虚拟列表，因为它本质上是一个长列表问题，如果点击的时候多出来的子项，你要如何使用虚拟列表去解决呢？

在 created 中去对方法防抖的一个处理的一个讨论，类似如下代码

<template>
  <t-input @input="handleNumberChange" />
</template>
<script>
import debounce from "@/utils/util.js";

export default {
  created() {
    this.handleNumberChange = debounce(this.handleNumberChange);
  },
  methods: {
    handleNumberChange() {
      // ...
    }
  }
}
</script>

7. 为什么不采用 class 的写法，创建一个统一的防抖管理器，每次使用时再 new 一个，然后不用时再销毁呢？
8. 反问（公司的业务是怎样的？面试官通过一个生活中的例子去介绍了公司的一个具体业务，讲的非常好，由浅入深）

总结二面，面试官前端方面有丰富的经验，而且面试过程中会给予相应的反馈，最后还会给予候选人对于自己角度的评价和建议，高水平的面试

三面

日期：2022/11/16

1. 自我介绍
2. 学习前端的时间？什么时候接触的前端？
3. 什么时候确定前端的一个系统的学习？
4. Vue2 和 Vue3 的区别？
5. 子组件和父组件的一个交互/通信
6. 有没有 Native 的经验？（这里我只是介绍一个项目，没有拓展，败点！应该基于 Native 介绍一下移动端和 H5 开发的区别）
7. 你觉得你的实习给你带来什么成长？
8. 为什么没有留在实习的公司？
9. 你会从哪些方面选择公司？
10. 反问（如果校招生遇到难以解决的问题，团队会给予什么样的资源帮助他？）

总结，这个好像是被捞的二面，之前二面面试官说三面应该不会有技术问题，但这个三面技术问题还是挺多的，而且三面时间不长，面试官兴趣也不大，他似乎更喜欢问一个问题然后候选人不断拓展更多边界知识的部分，从我回答一个问题以后又很长一段时间的问答停滞可以看出（他觉得我说的太少了）

已 offer 已拒