2020年终总结——前端入坑四年，今年实惨

写在前面

2020最后一天，我在KFC写总结。前几天就想写了，嗯，我是拖延症患者。😔 2020年，换工做、被裁人，体检一堆问题... 回顾我31年的人生，没有重点小学、没有重点初高中、专科学历、没有获奖经历、没有特殊技能、学习能力差、英语很差、拖延.... 加上如今算大龄程序员了吧，彷佛个人人生拿了一把烂牌，但是我仍是想赢啊。

我怎么走上了前端这条路？

11年毕业后，在工厂里打工，作技术员，跟IT无关。最好的4年光阴，感受错付了，可是不后悔，每一个人都有不一样的经历。而后14年的时候，以为这么下去我能看见我退休甚至死亡的时刻。因此我以为我应该学点什么？好让个人人生稍微有点不一样。 因而我买了大学接触过的单片机，想作硬件开发工程师哦。

因此要学汇编、学C（事实上我没学好，也能作个计时器啥的...） ，而后放弃了，这个不太好找工做。 而后学Java去了（由于上网找C语言资料的时候），学了一段时间后，大概到SSH框架吧，15年那时候来过一次杭州，面了一个作Java开发的，给了3500的工资（没去，那时候正在跟女友谈婚阶段了）。 后面16年初的时候接触了web前端（由于JSP要写HTML，查资料的时候web前端培训的广告挺火的），慎重考虑后，16年6月辞了工做（已经结婚了，老婆也支持），来杭州报了一个线下的培训班学习4个月，挺贵的，我仍是以为本身没学好。而后10月底的时候拿了个7K的offer，感受月薪过万有但愿了。 我就正式入坑了...^_^

四年的工做经历

第一份工做

16年10月份找工做，面了4家公司拿了2个offer，选择了这家作医疗检验的。工做了差很少三年。一开始去公司，改.net项目样式。后面先后端分离用JQ写项目。而后用Vue全家桶来作项目。这个阶段技术成长了不少。 也组建了一个8人的前端团队（特别感谢老板的信任，当初我买房还找他借了20多万周转，如今还欠着这我的情呢）。后面有想法作了一些工程化的工做，对于前端基建方面没有任何认知，团队管理方面也没有管理知识的支撑。

第二份工做

出于提高本身的目的来到这家公司的，结果跟我想的不太同样（虽然公司大了些，开发跟第一家公司也差很少），这一年成长太少了。好在学了算法。参加了早早聊，打开了视野。也在团队中也作了几回分享。

第三份工做

本打算好好工做的，奈何天不遂人愿，被裁了（为了融资扩招，而后裁人，找工做真的要擦亮眼啊）。三个多月的时间，简历被搞花了....

第四份工做（还在面试中......）

可能会选择去大一点的团队吧。

2020，我到底干了啥？

工做

7月份以前，主要仍是写业务代码，不过从年初到7月，大概面试了有小百人吧，这个对我来讲收获仍是蛮大的。接触了从应届到工做10年工做经验、大小厂的各类前端大小朋友。最大的感受就是：

• 工做年限不等于工做能力
• 平台牛不表明你牛
• 基础任何阶段都不能拉下

7月份换工做的时候也不是我本意，原本是申请回到总部办公的。因为其余缘由变成了离职。7月底的时候来了新公司（当时Scott建议我去丁香园的，考虑距离问题选择了这家），而后11月被裁了（为了融资扩招，可怜我试用期还没过呢）。心里委屈，毕竟是想好好上班的...
11月到如今，面试了9家大型互联网公司，暂时没有拿到offer，可是颇有信心，我必定能够。 这个月面试的感触：

• 基础知识要夯实
• 要有前端广阔的视野，后端要有必定的认知
• 要有某一方向的技术深度
• 性能优化必问
• 算法必定要刷

学习

这段时间刷了不少大厂面试题，作了一个整理，也是为了方便本身复习，有空就能够拿出来刷一刷。

HTML 和 CSS

• 你如何理解 HTML 结构的语义化？
• 谈谈之前端角度出发作好 SEO 须要考虑什么？
• 有哪项方式能够对一个 DOM 设置它的 CSS 样式？
• CSS 都有哪些选择器？
• CSS 中能够经过哪些属性定义，使得一个 DOM 元素不显示在浏览器可视范围内？
• 超连接访问事后 hover 样式就不出现的问题是什么？如何解决？
• 什么是 Css Hack？ie6,7,8 的 hack 分别是什么？
• 请用 Css 写一个简单的幻灯片效果页面
• 行内元素和块级元素的具体区别是什么？行内元素的padding和margin可设置吗？
• 什么是外边距重叠？重叠的结果是什么

......

JS基础

• call 和 apply 的区别
• b 继承 a 的方法
• JavaScript this 指针、闭包、做用域
• 事件委托是什么
• 闭包是什么，有什么特性，对页面有什么影响
• 如何阻止事件冒泡和默认事件
• 添加 删除 替换 插入到某个接点的方法
• javascript 的本地对象，内置对象和宿主对象
• document load 和 document ready 的区别
• “==”和“===”的不一样
• javascript 的同源策略
• 编写一个数组去重的方法

Ajax

• Ajax 是什么? 如何建立一个 Ajax？
• 同步和异步的区别?
• 如何解决跨域问题?
• 页面编码和被请求的资源编码若是不一致如何处理？
• 简述 ajax 的过程。
• 阐述一下异步加载。
• 请解释一下 JavaScript 的同源策略。
• GET 和 POST 的区别，什么时候使用 POST？
• Ajax 的最大的特色是什么。
• ajax 请求的时候 get 和 post 方式的区别
• 解释 jsonp 的原理，以及为何不是真正的 ajax
• http 常见的状态码有那些？分别表明是什么意思？
• 一个页面从输入 URL 到页面加载显示完成，这个过程当中都发生了什么？

......

JS高级

• JQuery 一个对象能够同时绑定多个事件，这是如何实现的？
• 知道什么是 webkit 么? 知道怎么用浏览器的各类工具来调试和 debug 代码么?
• 如何测试前端代码么? 知道 BDD, TDD, Unit Test 么? 知道怎么测试你的前端工程么(mocha, sinon, jasmin, qUnit..)
• 前端 templating(Mustache, underscore, handlebars)是干吗的, 怎么用?
• 简述一下 Handlebars 的基本用法？
• 简述一下 Handlerbars 的对模板的基本处理流程， 如何编译的？如何缓存的？
• 用 js 实现千位分隔符?
• 检测浏览器版本版本有哪些方式？
• 咱们给一个 dom 同时绑定两个点击事件，一个用捕获，一个用冒泡，你来讲下会执
• 行几回事件，而后会先执行冒泡仍是捕获

......

Vue

• vuex 有哪几种属性？
• vuex 的 State 特性是？
• vuex 的 Getter 特性是？
• vuex 的 Mutation 特性是？
• Vue.js 中 ajax 请求代码应该写在组件的 methods 中仍是 vuex 的 actions 中？
• 什么是 MVVM？
• mvvm 和 mvc 区别？它和其它框架（jquery）的区别是什么？哪些场景适合？
• vue 的优势是什么？
• 组件之间的传值？
• vue.cli 中怎样使用自定义的组件？有遇到过哪些问题吗？
• vue 如何实现按需加载配合 webpack 设置
• Vue 中引入组件的步骤?
• 指令 v-el 的做用是什么?
• 在 Vue 中使用插件的步骤
• vue 生命周期的做用是什么
• vue 生命周期总共有几个阶段
• 第一次页面加载会触发哪几个钩子
• DOM 渲染在 哪一个周期中就已经完成
• 简单描述每一个周期具体适合哪些场

浏览器

• 跨标签页通信
• 浏览器架构
• 浏览器下事件循环(Event Loop)
• 从输入 url 到展现的过程
• 重绘与回流
• 存储
• Web Worker
• V8 垃圾回收机制
• 内存泄露
• reflow(回流)和 repaint(重绘)优化
• 如何减小重绘和回流?
• 一个页面从输入 URL 到页面加载显示完成，这个过程当中都发生了什么？
• localStorage 与 sessionStorage 与 cookie 的区别总结
• 浏览器如何阻止事件传播，阻止默认行为

生活

平平淡淡，两个姑娘愈来愈漂亮了 这个月没上班，接送大姑娘上下学、去培训班。如今的小孩子要学的可真多，我3岁多的时候应该在捏泥巴吧。 遗憾的是，由于疫情的缘由没能带老婆孩子出去玩玩，明年补上吧。

2021，必定会更好的

许多事情要提上日程了，健身、英语、算法、理财、旅游、装修........想作的事情不少。

• [ ] 多写一些总结，多复盘【每个月输出2篇文档】
• [ ] 算法【每日打卡，要弄懂】
• [ ] 一次旅游 【希望疫情完全过去吧】
• [ ] 读书【尽可能每个月1本吧】
• [ ] 装修【房子交付要装修了】
• [ ] 健身 【动起来，体检好几项都不行，得关注一下身体健康了】
• [ ] 英语【背背单词】
• [ ] 理财 【暂定吧】
• [ ] ....

2021年，走的慢一点不要紧，千万不能停！将来必定会更好的。

最后

前端工做四年多点了，好在没有放弃。虽然离优秀还很远，但贵在一直坚持。技术慢慢在提高、视野愈来愈开阔、薪水也比刚作前端时多了3倍多，我无法跟那些优秀的人比，我只能跟本身比，今天的我比昨天的我进步了一点就很开心了。 2021年，必定要读完的3本书《刻意练习》、《复盘》、《戒了吧，拖延症》。 愿本身愈来愈好。