记录我第一次正式面试（已offer）

最新推荐文章于 2023-02-23 12:27:10 发布

Z5uo

最新推荐文章于 2023-02-23 12:27:10 发布

阅读量2.1k

点赞数 1

分类专栏：前端面试题文章标签：深信服面经 2019秋招

本文链接：https://blog.csdn.net/Char_n/article/details/82869355

版权

前端面试题专栏收录该内容

7 篇文章 0 订阅

订阅专栏

深信服2019届秋招

心疼自己中秋节当天还去面试，顺便也心疼一下面试官。
说说我的第一次正式面试，简直是体验不要太好。深信服的一二面简直不要太舒服，我听别人面试都是说好紧张，搞得自己也有点小紧张；进去后才发现，根本不存在紧张的说法，好吗？一面的面试官是15届毕业生（我问他的），根本就没想象中那种冷面、居高临下的感觉，我答不上来的题，他都会跟我解释，然后接着提问题。整个过程给我的感觉就是一次技术交流，最后给我的感觉就是自己跟工作了三年的师兄？前辈？之间的差距，他确实考虑到我之前很多没想过的点，说的每个点，我第一反应：什么还能这样玩？真的是学到了。

一面

Q：nodejs的创建文件操作

A：fs.writeFileAsync()：写文件操作；fs.readFileAsync()：读文件操作
Q：Linux下查看文件的命令
```
cat、more....
```
（我这里答的是vi，然后他就顺势问了我，那保存操作呢。:wq、:w）

Q：webpack配置路径别名

A：这个，我是真的不会。。。我只是秒过一眼，是现在想不起来怎么配置的了。

module.exports = {
  entry: '',
  output: '',
  resolve: {
    extensions: ['.js', '.vue', '.json'],
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': resolve('src') // 重点在一句
    }
  },
  module: {}
}

Q：Vue中父子组件的传值？
- 在父组件中注册子组件，在子组件上面直接v-bind:data；
- 子组件中，设置props接收父组件的数据。
- 注：Vue中的父子组件的传值是单向的
- 子组件中，利用$emit向父组件广播一个消息
- 父组件在子组件上用@绑定监听子组件的事件
Q：这种传值过程是单向还是双向？如果我想直接在子组件修改父组件中传过来的数据同时修改父组件（不用$emit，怎么做）？
- A：用Vuex
- Q：不用这个呢。
- A：这…我涉猎的比较少。不知道
- Q：直接在前面加一个.sync修饰符
Q：在前面的基础上，我在子组件中修改了对象数据，那么父组件中的数据会不会随之改变？为什么？
- A：会，因为它这里是对父组件的数据的一个引用
Q：那怎么去解决这个问题？
- A（你要解决，那你前面不要把数据变成双向的啊…）：用深拷贝，将整对象拷贝。
- Q：怎么深拷贝
- A：用Object.create()
- Q：你都是用这个去拷贝对象吗？
- A：是的，还有一种就是递归对象，再将每个属性赋值给一个新的对象（此处应有手撕代码？？？）
Q：组件A由组件B、C组成，且A挂在路由上，那么B、C有路由钩子吗？路由钩子有哪些？
- A：B、C没有。（后面这个我答不上来，我跟他说了有三个，但是我忘了函数名）
- 组件内路由钩子：beforeRouterEnter、beforeRouteUpdate和beforeRouteLeave
- 全局钩子：beforeEach、afterEach
Q：平时会用setTimeout吗？现在有一个场景：你在组件A中设置了一个定时器5s后执行，突然你跳转到组件B，那么请问这个定时器还会执行吗？那这个定时器中的函数访问了组件A中的某些变量，会报错吗？怎么去解决这个bug？
- A：会执行。也会报错。怎么解决吗？清除微任务里面所有的setTimeout(这里我说错了，其实setTimeout是在宏任务里的)
- Q：具体怎么清除？
- A：我说在destroyed中去调用clearTimeout
- Q：你确定吗？这样子其实是不行的，你回去自己实验一下。
Q：Vue放在computed中所有方法都可以放到methods中吗？反过来可以吗？为什么？
- A：可以的。
- A：不可以
- A：…真不知道（期间，胡扯海说了一堆，都没扯对）
- Q：其实你想一下，computed中的函数是不能传参的，它只有新值和旧值这两个参数；而methods是可以的。另外前者的性能比后者要好一点。
- A：我…学到了。
Q：你跟我说说Vue的生命周期吧。
- beforecreated：Vue实例正在被创建，$el 和 data 并未初始化
- created:完成了 data 数据的初始化，$el没有
- beforeMount：完成了 $el 和 data 初始化，挂载之前为虚拟的 DOM
- mounted ：完成挂载
- beforeUpdate：在 data 变化时，触发该函数
- updated：在 data 变化时，触发该函数
- beforeDestroy：在组件销毁前，触发该函数
- destroyed：在组件销毁后触发，此时 Vue 实例解除对事件的监听和数据的绑定，但 DOM 结构还是存在。
Q：了解网络编程吗？GET和POST在一次完整的请求中分别与服务器交互了几次？
- A：POST比GET要多一次交互，GET是一次，POST是两次。
- Q：你说对了。POST发的两次是哪两次？
- A：再次懵逼…（还有这种操作？）
- Q：POST第一次发的是PUT，第二次再发起POST。
Q：说说TCP的三次握手吧。
- A：…（网上一大堆，我这里就不贴文字了。）
Q：你还有什么问题要问我的吗？
- A：你是什么时候毕业的？
- Q：（一脸惊愕）为什么会有这个问题？
- A：我觉得你应该比我大不了多少，和你聊天很轻松…
- A：可以请你评价一下我本次的面试吗？
- Q：整体来说，你的基础挺扎实的…
- A：可以不用这么客套，可以扎心一点的。
- Q：你基础算不错，但技术的广度差一点，像webpack的配置其实是挺简单的，你可以去二面…
- A：（欣喜若狂）

二面

Q：谈谈Koa的中间件？说说Koa中间件的模型。
- A：第一个问题，卒。

Q：你能手写一个防抖节流函数吗？

function throttle(fn, timer){
  clearTimeout(fn.timer);
  fn.timer = setTimeout(fn, timer);
}

Q：如果我要在一个页面加载一万/百万条数据，那么页面在滑动的过程会发生卡顿，你说说怎么优化它？
Q：一个页面内都是图片（一百张以上），你会怎么去优化它？
Q：看过jQuery源码，是吗？用伪代码说说$()这一个选择器的功能。
Q：了解call和apply吗？它们有啥区别？如果我跟你说这两个中有一个性能要比另一个好，你觉得是哪个？为什么？
- A：两个都是用来修改this指针。两个的传参不一样。前者是一个一个传，后者传一个数组。
- A：apply
- A：因为它不用一个一个传参数，直接一个数组就行了（瞎掰）
面试后找的答案，其实 call 的性能是要比 apply 好一点的。

因为 apply 最后还是转化成 call 来执行的。

知乎上有人做过测试，用 call 和 apply 分别去执行一万次 add 函数，得到的结果是 11ms 和 25ms。
Q：谈谈JS的垃圾回收机制吧？什么时候会触发浏览器的垃圾回收？
- 标记清除
  
  JavaScript 中最常用的垃圾收集方式是 标记清除（mark-and-sweep）。当变量进入环境（例如，在函数中声明一个变量）时，就将这个变量标记为“进入环境”。从逻辑上讲，永远不能释放进入环境的变量所占用的内存，因为只要执行流进入相应的环境，就可能会用到它们。而当变量离开环境时，则将其标记为“离开环境”。
- 引用计数
  
  引用计数的含义是跟踪记录每个值被引用的次数。当声明了一个变量并将一个引用类型值赋给该变量时，则这个值的引用次数就是1。如果同一个值又被赋给另一个变量，则该值的引用次数加1。相反，如果包含对这个值引用的变量又取得了另外一个值，则这个值的引用次数减1。当这个值的引用次数变成0时，则说明没有办法再访问这个值了，因而就可以将其占用的内存空间回收回来。这样，当垃圾收集器下次再运行时，它就会释放那些引用次数为零的值所占用的内存。
- 分代回收
  
  目的是通过区分「临时」与「持久」对象；多回收「临时对象区」（young generation），少回收「持久对象区」（tenured generation），减少每次需遍历的对象，从而减少每次GC的耗时。**Chrome 浏览器所使用的 V8 引擎就是采用的分代回收策略。**如图：
- 增量回收
  
  这个方案的思想很简单，就是「每次处理一点，下次再处理一点，如此类推」。这种方案，虽然耗时短，但中断较多，带来了上下文切换频繁的问题。Firefox 浏览器所使用的 JavaScript 引擎就是采用的增量回收策略。
- 什么时候触发垃圾回收
  - 通常在引擎申请内存配置时，已分配内存不足的情况下会触发 GC 操作。
Q：从地址输入url，回车。这个过程都发生了啥？
Q：前端可以访问到所有的cookie吗？

A：可以。（正确答案是不可以。。。）

答案：禁止javascript操作cookie（为避免跨域脚本(xss)攻击，通过javascript的document.cookie无法访问带有**HttpOnly**标记的cookie）
Q：会打断点吗？会看堆栈吗？在哪里看？
Q：学的是Vue，是吧？知道虚拟DOM吧，说一下它的基本原理吧。根据你刚才说的，你再说说jQuery手动去操作DOM和虚拟DOM的性能，哪个好？虚拟DOM的性能一定比jQuery操作DOM的性能好吗？
Q：了解diff算法吗？
Q：Vue中的双向数据绑定原理是defineProperty，你还知道哪些方式能实现双向数据绑定吗？
Q：你等一下哈。（走过去和一面的面试官讨论，回来）根据你的情况，我觉得你作为一个研究生…

A：哈？我是本科的…

Q：你等一下，（又过去和一面面试官讨论，回来）。如果你是研究生的话，你说你记不起之前做node的项目了，我是觉得不应该的，因为我对研究生会有更高一点的要求。但，你是本科，我觉得还是可以的。你出去登记一下待会直接HR面吧。

A：（心情跟坐过山车一样，贼刺激）我可以问你一些问题吗？

Q：emmm？

A：你觉得我面得怎么样？

Q：基础不错，其他的也挺好的。

A：那你觉得我这样去HR面会有多大概率拿到offer?

Q：hr面的话，更多是看你这个人的性格，人品，品质什么的。你的技术，经过我们两轮的技术面，我们是肯定了你的技术的，所以你不用担心hr还会问你技术的问题。

A：谢谢。

HR面

…

Z5uo

关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
记录我第一次正式面试（已offer）

深信服2019届秋招心疼自己中秋节当天还去面试，随便也心疼一下面试官。说说我的第一次正式面试，简直是体验不要太好。深信服的一二面简直不要太舒服，我听别人面试都是说好紧张，搞得自己也有点小紧张；进去后才发现，根本不存在紧张的说法，好吗？一面的面试官是15届毕业生（我问他的），根本就没想象中那种冷面、居高临下的感觉，我答不上来的题，他都会跟我解释，然后接着提问题。整个过程给我的感觉就是一次技术交...
复制链接

扫一扫

专栏目录