前端工程：apis接口封装实践

前言

最近在学习Chromium内核blink部分的代码，感触比较深的是Chromium项目的代码组织实现，同样是C++代码，大二时候写的项目真是惨不忍睹，而Chromium的代码（blink部分，据说V8里面用了各种奇技淫巧）却清晰明了。

印证了我同事的一句话：

语言、技术没有高低好坏之分，而写码水平却有高低好坏之别。

“Talk is cheap, show me the code”，写码水平高低一看便知。写的代码多了，慢慢也开始思考如何在保证正确性，易读性的前提下去追求设计模式等一些能带来质的改变的东西。

下面简单介绍一下，在前后端分离的大背景下，前端apis的接口封装实践。

apis封装

之前做过一些个人项目采用了前后端分离的解决方案，那么不可避免的一个问题是：怎么与后端通信？AJAX！通信不是问题，问题是怎么优雅地通信。

我写第一个项目的时候，非常简单，哪里需要网络请求，就在哪里写$.get(url) / $.post()，用了jQuery。

写第二个项目的时候，觉得jQuery太重（对不清楚背后原理的事物保持慎重，后来看了zepto.js的源码，感觉好了一些），于是在网上找了一些封装好的Ajax库（100多行代码吧）。但是同样，还是哪里需要网络请求，就在哪里写Ajax(url)。

当我再要写项目的时候，我想，能不能换点别的？这时候我想起一开始在创业公司的时候leader教导：

第一次做，实现功能就好。再做，就要想着怎样做得快。第三次，可以想想能不能换种方式做。再后来，尽量别做重复的事情。

于是我总结上两次项目apis方面的缺点：
1. 到处都需要自己拼URL，别人调用这个接口时，根本不知道URL怎么拼（可以通过api文档解决）
2. 对于请求的错误处理，每个地方都要写一遍，绝大部分处理方式都是一样的，相当于重复代码。

把apis抽象一下：
1. 发送get/post请求
2. 带参数

一想，apis要做的事情不就是构建http请求，再挂载相应的参数这么简单吗？于是有了下面的实践。

apis.js：接口封装