2017.11.06-2017.12.01实习小记

前言

自11月1号来到北京后，已经有一个月了，仅以小文总结一下此番来京的实习经历。

实习工资很低，再加上北京租房签约多是一年起，为了离公司近、费用低兼得，我只得在离公司近的一个村里找了一个还不错的公寓住了下来，即使这样一千多的房租还是让我有点无奈，要知道我在学校附近可以租一套小区里的四室一厅了。我之前在昆明做外包攒的万把块钱到这就几乎生存不下去了，约了几个在北京的好友之后更是捉襟见肘。

好在公司食堂很赞，早中晚餐+下午茶+夜宵一共五顿免费管够，味道也比所谓的互联网第一食堂猪场食堂好太多，可能是我去猪场面试的那两次吃的菜都比较清淡吧~

这边的hr小姐姐人很好，在得知我来了北京后立马帮我安排入职了~

我们团队有二十几号人，应该算是规模大的前端组了，技术栈也非常新，不仅仅涉及到vue、webpack等流行前端技术，对可视化技术的研究在业内也是非常有前瞻性的。关于我们

技术架构.png

下面我将从这三个方面来总结这段实习日子的收获：

• 工作氛围
• 技术
• 其他

工作氛围

1. 体验大厂规范的工作流程
   在这里，有着一套成熟的工作流。从项目、知识、邮件到日常办公管理等，都有相应的工具软件支撑着。
   各个工作职责块都被分割地巨细无遗，修bug需要几人天都是记录在案的，这让追踪工作流和量化工作指标成为可能。

2. 随手可得的丰富知识资源
   我曾在freecodecamp里接触到了read-search-ask的学习理念，在这里，经验丰富的前辈们早就把相关的优秀学习资源总结罗列出来了，有需要的话可以结合google来read和search，最关键的是，真人就在身边，前两步都搞不定可以轻松地请教和讨论问题。
   我可以在这里快速地学习到：

• 前端基础，如css和JavaScript
• vue相关，团队内部甚至造了一个vue的UI库
• 可视化相关，包括svg、canvas、webgl、three、d3、gis等
• 安全攻防相关，除了常规的安全攻防外还有流量过滤和流量分析等高级玩法
• 算法
• 大数据
  ...

3. 参与高效运转的团队协作
   我们有自己搭建的gitlab服务器，在这之前，我还没参与过人数超过三十个、平均每两分钟就有一次提交、几十个分支的项目，不过这次我有机会参与了。对git中的add、commit、fetch、pull、merge、rebase、push、checkout、branch、reset等命令也有了更加深刻的理解，因为有应用场景了嘛~
   有人说，大厂里大部分人都是螺丝钉，这句话无可厚非，社会分工本就是越来越细的，正是因为有大量各司其职的螺丝钉高效地工作，才能产生出个人无法达成的成就。根据二八法则，非螺丝钉只是少数人，目前我还是非常乐于当螺丝钉的。
   之前还在学校跟着老师做项目的时候，我一个人可以负责需求、产品、策划、前端、后端接口设计、服务器维护甚至在会议桌上争取客户，但是那只有一个字：累。而且效率很低，有的做错了也全然不知。在这里我可以专心考虑前端的问题，那种感觉是非常爽的。
   提交代码之前，可以叫同事来review，讨论几种解决问题的思路。遇到难题的时候，还可以结对编程，写出来的代码又快质量又高。
   leader也告诉我：不要在已解决的通用问题上耗时间，直接找解决过的人。

总结：

1. 编码的时间是大于讨论设计的时间的，因为需求量大，各方沟通成本也很高(产品、设计、后端)。
2. 有命名规则、注释等编码约定，大家也自觉遵守，作为新人的我上手业务也很快。代码格式通过eslint和stylelint控制。
3. 对于错误、异常、安全等没有很明显的的统一处理方案，似乎期望测试测出来。
4. 接口和api的约定不是很稳定，虽然有wiki记录着，但是经常变更用法。
5. 可重用代码和模块代码都有标准的，使用一个自定义配置驱动
6. 性能方面可视化那一块很关注，因为涉及到大量的计算，web worker要玩的很6，业务这边关注较少
7. 技术栈主要是vue以及它的生态插件、有一个自制组件库，没有落后潮流，不过看样子可视化那块是领先的，不过团队里还有人用jq
8. 写代码偏独立编程，团队里没有结对编程的习惯，不过协同构建很普遍，每个人熟悉一块内容，不懂直接找TA来帮忙就ok
9. 目前只看到leader封装的库里写了测试，业务部分没有写自动化测试脚本的习惯，有配备测试团队但不是自动化的
10. 提交代码没有review，不过可以自己找同事来review

技术

1. 开发环境
   我刚接触前端的时候用的是sublime，因为它轻量好用，打开个啥都快的很，界面也好看。
   后来，开始用Angular，typescript自带的工程化特性已经不适合用sublime写了，vscode成为了我新的伙伴。
   现在来到了公司，编辑器都变得那么无力，而且vue中的eslint似乎和vscode老过不去，我又是习惯先啪啪啪一顿写然后格式化的人，不得已又换上了webstorm。真正的大型项目还得上IDE。
   不过好在公司有好人相助，他负责国内一个前端翻译团队，解决这些环境问题玩得跟砍瓜切菜一般，后来下班之余我俩就成了研究源码的好伙伴。
   唯一想吐槽的就是公司发的电脑有时候删不了文件，只能通过rd /s /q [filename]来删除

2. vue全家桶
   这期间无论是看文档还是写项目，我也基本熟悉了vue、vuex、vue-router、axios等全家桶的用法，期间碰见几个有意思的点：
   2.1 动态渲染路由
   有时候，不同用户所能看见的路由菜单是不一样的，也就是需要后端返回当前用户的实际路由。这时候一般来说有两种解决方案：
   一.前端先挂载所有路由，然后根据后端数据屏蔽某些路由。
   二.前端先接收后端数据，然后挂载路由。
   我们在某个项目中使用的是第二个方案，而且后端返回的是一个线性的数组，所以我们需要将它转化成树状的数据结构，然后再转化成vue-router的数据结构。
   期间感受到了从ts转js没有类型机制的不方便，而不熟悉vue-router的我在转化成vue-router的时候也遇到了一个问题，后面一查发现是少了meta字段，后面有时间把这个问题复现一下单独写篇文章分析一下。
   2.2 强大的vue tools
   有一次我在封装一个业务组件的时候定位不到问题，于是请教了一个编写基础组件的同事来帮忙，只见他熟练地打开Vue tools查看组件间的通信和内部的状态，一下就找到了问题。
   还有一次是坑爹的后端传的破数据，导致前端背锅，也是vue tools帮忙找出来的。
   2.3 树组件节点选中触发多次选中事件
   在使用树基础组件的时候，我发现选中一个节点它的父节点也会相应的选中，然后触发多次节点状态改变事件，为了解决这个问题，我也是头疼了半天，最后想到为什么不用节流或者防抖动解决呢？不过开始我没有理解节流和防抖动的本质区别，使用了节流，还是会触发2次事件，后面看了一篇文章，发现这种情况应该用防抖动。
   2.4 vuex的state中的数据没有响应式更新
   有一个页面，需要取vuex的一个state，我傻乎乎的直接访问$store去拿，结果当这个state变化的时候页面没有更新数据，后来我的一面面试官发现了这个bug，告诉我应该用mapState取state，然后用computed更新数据，我后面又看了看vuex文档，发现state设计成state=>getter=>mutation=>action还是有一定道理的。

3. 深入研究源码
   在使用Angular的时候，我也就停留在API层面上，对于底层封装的代码浑然不知，以至于面试时碰到源码的问题就窘迫的不行，还好公司里有对源码有研究的同事H，于是我就在他的带领下下班吃完饭之余研究MV*的实现原理...最近还在研究一个精简的库Moon，等过段时间研究Vue和Angular/React，目前已经写了第一篇文章，以后慢慢更新~

最近leader分配给了我一个vue1的项目让我维护，这个项目的新版本刚好是4月发布，于是我就想把它升级到vue2去，虽然期间可能会产生更多问题，但是我想这些试错对我来说是值得的。

其他

1. 对毕业论文有了灵感
   我的专业是信息安全，我们的业务也是安全大数据相关的，我也许可以利用自己掌握的前端技术和安全知识做一个有意思的毕业作品。

2. 担心可能会被清理
   虽然我住的这个村接到的通知是15号之前清退，而且房东也说他的房子是建在宅基地上的，不在清退范围内的，不过还是让我思考起了来北京的意义。明知道这边生活成本如此高，社会地位也低，每天挤着公交，偶尔吸吸雾霾，为什么还要过来呢？

我想大概是这座城市里还存在着各种机遇吧~