前端面试：分享一道曾让我栽在二面的面试题｜项目复盘(1)

一转眼又到了跳槽季，是时候跟大家分享一波面试题了，通常来说大家在跳槽之前都会刷题，甚至说从不刷题的多年开发经验的大神在面试中可能干不过刷过各种题的面试者，导致了一顿内卷，这也侧面印证了看面试题的重要性。

我也看过很多的面试题文章，比较反感的是那种代码片段巨长或者牵扯到的知识点巨广抑或是与各种复杂的数学公式相关的还有就是过于底层的那种题：像什么手写Promise A+规范、手撕红黑树、用公式实现个什么Canvas xx特效、浏览器是怎么实现xxx API的、如果浏览器没有提供这个 API 的话要怎么去模仿实现该 API，Vue3 的 diff 算法和 React 的 diff 算法有什么区别、能不能手写个他俩的结合版 diff 算法、手写个 React 的时间切片……

相信大部分人也和我一样，每次看这种文章的时候，不是看着看着就没耐心往下继续看了、就是看到一半就忍不住翻到评论区看评论了，然后点赞、关注、收藏一键三连，收藏夹里都快积攒上千篇文章了，这种文章虽然技术含量很高，但是过于的枯燥乏味，抑或是牵扯到的知识点过广，要是其中哪个知识点自己不太熟的话，后续的内容也就都看不懂了。就像是上数学课一样，刚开始没认真听讲，落下了某个知识点没听到，再回过神来的时候发现已经听不懂了。

比如有一次看一篇文章是实现个什么非常炫酷的 Canvas 特效，看着看着突然冒出来了三角函数，虽然中学的时候也都学过这些，但经过这么多年后早就把什么 sin、cos、tan 这些符号的意思忘的差不多了，但也懒不想再打开浏览器一顿搜索一顿查，就继续往下看吧，看着看着又出现个什么矩阵算法，大学的时候其实也学过，总之看到最后实现出来的效果非常酷，但具体是怎么实现的心里也是云里雾里的。除非真的工作中要用到这个，才会仔细看文章去钻研，即使是工作中不会用到的同时还仔细钻研了一番，通常很快也就会忘记。

而另外一种文章则是非常立竿见影的：那就是讲述的知识点并不复杂，只是以前从未想过可以这样用，相当于是一种思路，抑或是自己以前不知道的一个 API，用起来很方便。这种文章看着也不会特别的枯燥乏味、并且还看的津津有味的，感叹：原来还可以这样用啊！自己以前怎么就没有想到呢？

这种文章看过了不会特别容易忘记、甚至在工作的过程中还会找机会去用一下试验试验。给大家举几个例子：

一定时间无操作时播放视频

当时处于刚刚入行的阶段，经验比较差，所以有些很普通的需求自己却没思路。当时做的是 Electron 项目，放在阳明古镇的一面墙上展示，需求是当用户十分钟都不操作界面的话就自动播放阳明古镇的宣传视频，当时脑子就像是卡住了一样：怎么才能知道用户十分钟都没有操作呢？为此还专门去查找有没有这样的 API，后来看到一篇文章让我大呼真妙！👍

原理也超级简单，就是在页面上设置一个十分钟的变量:

let minute = 10
复制代码

然后设置个定时器每分钟 -1:

setInterval(() => {
minute–
if (minute <= 0) {
// 播放视频
}
}, 1000 * 60)
复制代码

当有事件发生时就代表用户在操作，需要还原变量：

window.addEventListener(‘click’, () => minute = 10)
复制代码

还可以监听 mousemove 或者键盘等事件，但那个项目是触摸大屏，没有鼠标或者键盘，所以监听点击事件就够了

短短几行代码就解决了我的燃眉之急，当然那时候也菜，这么简单的需求都没想出来，不过谁还不是从小白一步步走上来的呢？正是靠着这些文章一步步扩展了思路才会很快的进步。

Vue 性能优化

看了黄老师出品的 《揭秘 Vue.js 九个性能优化技巧》

才知道原来 computed 里面的函数是可以接收一个 this 参数的：

computed: {
a () { return 1 },
b ({ a }) {
return a