前端开发中的软件工程学

[moxiaohe]

前端开发中的软件工程学

早上睡不着，半睡半醒之间，想到了一个概念：前端开发中的软件工程学。

首先，我为什么要研究这个概念

原因主要有三点：

第一，很多人都只认为前端约等于美工，所做的事无非是切图，高保真，demo，你看，大部分的大约80%的前端工程师，都是在做这个，但我知道并不是这样，前端是一个技术革新非常快的岗位或者说是领域，她介于设计和后端开发之间，包含了设计的一些内容，也包含了开发的一些内容，设计暂且不讲，它既然包含了开发，就应该适用于软件工程学的一些方法论，html、css方面涉及的比较少，单javascript却是一门标准的不能再标准的面向对象的语言，对于它的运用就该遵循这样的方法论。
图：（三个圈，分别是html、css、javascript，有重叠，也有独立，独立的地方就在于自身的魅力，比如jaavascript的魅力就在于，它不仅仅可以控制DOM和CSS的渲染，它还可以实现业务逻辑，甚至在服务端，还可以操作磁盘文件、读写内存、读写数据库）

第二，这几年，作为几个前端开发的技术管理者，我见过越来越多的同学进入前端开发的行列，走上这条“不归路”，每天重复干着某几件事情，但是从投入产出比的角度，两三年甚至四五年，提升都非常之缓慢，当然，这只是我个人的观点，也不代表所有人。我始终在想一个问题，那就是如何提高前端的生产力，还有产出物的质量，我称之为，面向过程的开发过程优化。

第三：专业的装逼技术，通俗一点说，就是让前端更专业化、职业化。专业化就是做专业的事，职业化就是让互联网行业或者说是IT行业更认可这个职业、这个岗位，说不定还能让你迎娶白富美、当上总经理、出任CEO，走上人生巅峰。

其次：它不能做什么？

他不能让你绕过那该死的兼容性问题。它不能让你的代码一击千行。它不能让你摆脱加班的命运。它仍然仅仅是个方法论。

好了，步入正题，前端开发中的软件工程学，到底包含哪些？

代码测试

这包括单元测试、性能测试、覆盖率测试等等，可能这些都只是针对javascript的，但你总要写javascript的吧。

单元测试就是针对写的代码快的结果测试，预先考虑一些非预期的输入值，性能测试，就是避免一些低级的、执行缓慢的写法，比如变量预存、for循环查找DOM等等，覆盖率测试就是测试你的代码覆盖率的情况。

总之，他们就是要让你的js代码，在生产环境运行良好，效率更高，对于各类测试的方法和过程这里不做细说，各位可移步询问度娘或者谷歌。

代码预处理

前端开发是一个执行期的语言，没有编译过程。这就带来，前端的代码有一定的生产不稳定风险而且开发效率低下，但是有一些先驱已经魏我们找到了一些这方面的解决办法，那就是

• 针对HTML的一些模板语言和模板引擎，比如Jade、art-template、handlebars等等
• 针对css的sass和less
• 针对javascript的coffee script等等

以上这些可能都需要一些环境才能使用，但对于先天需要学习型的前端工程师来说，这些都算得了什么，再加上它们的确可以为我们避免一些错误，提高我们的开发效率，你还等什么呢，为了提升你的逼格，也要踊跃的试一试啊。

文档生成

我们在开发中，或多或少都会写一些注释，那些不喜欢写注释或者没这个良好习惯的，请你赶紧逼自己一下吧，码农何苦为难码农，你不写，那就意味着，读你代码的人将会骂你千百遍啊。扯远了，拉回来，有时候，我们仅仅是写注释还不够，可能还要写一些文档，比如API手册供使用者阅读、接口文档供存档备份，等等的，不管是什么目的吧，这总是避免不了的。还用手写吗？难道用脚写吗？哈哈，不是这个意思，我的意思是，你可以用你的注释生产啊。是啊，我写注释，并不仅仅是用来给别人看的，我还可以用来生产文档。但是，话说回来，生成文档的工具，可是需要你标准书写规范的哦，不过，为了这个目的，让你的注释也具有更高的可读性，而且还优雅的装逼，何乐而不为。

持续集成（CI）

可能有人听过这个概念，也可能仅仅是表面的了解。我想说的是，持续集成，并不仅仅是有个分支可以不断的提交代码用以修复bug，也不仅仅是多人可以协同修改一个分支，它还包含了代码的测试，还有你每一次提交的质量和对整个分支的回归。

好吧，以上概念可能都比较浅陋，每一个展开讲，都可能会写一本书那么厚，我也仅仅学得皮毛，就不献丑了。只是抛砖引玉罢了，目的是想揭示在前端开发的过程中，大家也可以运用这些方法论来指导我们的开发过程，使得更加高效、稳定、标准。更多的内容，请读者自行查阅学习。
（以上内容只是个人观点，欢迎交流补充，手下留情请勿乱喷）