锐客网

  1. 首页 > it技术 > >

拿起Typescript做一个轮子（二）

编写基础请求代码 我们现在开始编写源码，我们的目标是实现简单的发送请求功能，即客户端通过XMLHttpRequest对象把请求发送到Server端，Server端能收到请求并响应即可。
我们实现axios最基本的操作，通过传入一个对象发送请求，如下：
【拿起Typescript做一个轮子（二）】拿起Typescript做一个轮子（二）
文章图片

创建入口文件 先把初始化src下的文件删除掉，然后创建个index.ts文件，作为整个库的入口文件，然后先定义个axios方法并导出，如下：
拿起Typescript做一个轮子（二）
文章图片

然后给axios方法定义个接受参数config，并且我们新建个types文件夹在该文件夹下新建个index.ts文件作为我们之后公共类型定义文件，然后给config定义个接口类型：
拿起Typescript做一个轮子（二）
文章图片

这里我们希望method只传入合法的字符串，再定义个字符串字面量
拿起Typescript做一个轮子（二）
文章图片

然后我们在src下新建个xhr.ts文件，在这个文件下实现我们所有的请求逻辑
先实现基本的请求逻辑，后续再慢慢完善，函数同样接受一个config参数
拿起Typescript做一个轮子（二）
文章图片

然后引入该方法并使用
拿起Typescript做一个轮子（二）
文章图片

目前为止我们axios的基本请求逻辑都已经实现了，让我们来写个demo测试下
后端服务是用node简单起的一个服务，后续demo用到的接口都在这产出
拿起Typescript做一个轮子（二）
文章图片

拿起Typescript做一个轮子（二）
文章图片

拿起Typescript做一个轮子（二）
文章图片
拿起Typescript做一个轮子（二）
文章图片

可以看到我们成功发送了请求，并且服务端也接受并响应了，那我们这章的目标都实现了，下章会对请求的数据进行处理

    推荐阅读


    上一篇：创业与学习-03|创业与学习-03 好好学习

    下一篇：在linux终端上python实现缩进