使用TypeScript重构Axios:让你的项目更加完善

引言

  如果你使用过或者了解过JavaScript,那么在使用其开发的过程中,势必会了解到Axios。我们都知道,它带来便捷与效率的同时,js本身也会伴随着一些不大不小的问题。
  当用JavaScript开发大型项目时,因为没有类型检查,所以很多错误只有在运行的时候才能发现。而Typescript恰恰弥补了JavaScript这个缺点。

传送门

目前有个现成的项目,已经将Axios通过Typescript重构,我知道你会有所需要。如果你平时也喜欢用Typescript编写一下第三方框架的话,那这就是个不得不✨Star✨的项目了。

了解一下Axios

Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。有以下特性:

  • 从浏览器中创建 XMLHttpRequests
  • 从 node.js 创建 http 请求
  • 支持 Promise API
  • 拦截请求和响应
  • 转换请求数据和响应数据
  • 取消请求
  • 自动转换 JSON 数据
  • 客户端支持防御 XSRF

简单介绍一下差不多是这样的,但是网络请求库有不少,为何偏偏选择Axios?

  1. 简单易用,api接近于jquery,比原生的fetch之类的简单。
  2. 浏览器兼容性好,都能兼容IE7,使用fetch就得自己处理兼容。
  3. 通用性好,能在node和浏览器中使用,api一致。
  4. 稳定大牌,vue官网文档有推荐。

  此外,就单单一个http请求,我们主要关注的是功能是否完整,有的请求库不支持header+post+get同时发送。
  然而,Axios简单,几分钟就上手了,几乎我们开发需要的请求都可以使用。
  而且用的人多,就直接用这个,不用管其他的。这个是客户端用的,也不用因为项目使用的用户多而需要考虑性能问题。因为客户端的开发,用户再多也不会影响其他用户,现在的硬件配置自然不需要再那么多的考虑。
  这些库既然用的人这么多,那么它肯定没什么需要我们自己考虑的问题啦。还是回到原点,那就是看请求的方法和功能,HTTP的header、post、get这些数据是否符合我的习惯,返回的结果能解析成什么样的格式,能上传什么样的格式,我传post数据的时候是否能请求一个header带上我的token,和加一些get参数。
  所以,综上而言,Axios无疑是最佳之选。

为什么要选择用Typescript重构一番?

  开头引言也提到了一点,因为Typescript多了一个类型检查。

  简单介绍一下Typescript:

TypeScript具有类型系统,且是JavaScript的超集。 它可以编译成普通的JavaScript代码。 TypeScript支持任意浏览器,任意环境,任意系统并且是开源的。

  Vue我想对于很多人来说都是耳熟能详的,而现在开发一些库的时候都是用Typescript。同时,又因为它自带类型检查,所以在编译阶段就能发现一些容易产生的错误。这使得它深受Js程序员的喜爱。

结语

  是不是因为还很不错的样子?如果你会因为JavaScript没有类型系统,导致运行的时候频频出错,那建议你试试Typescript。
  行百里,半九十。既然可以有更好的,为何不试试呢?

无标签
打赏
评论区
头像
文章目录