1.axios 原理还是属于 XMLHttpRequest, 因此需要实现一个ajax。
2.但还会需要一个promise对象来对结果进行处理。
3.ajax实现
var Ajax={
  get: function(url, fn) {
  // XMLHttpRequest对象用于在后台与服务器交换数据
  var xhr = new XMLHttpRequest();
  xhr.open('GET', url, true);
  xhr.onreadystatechange = function() {
    // readyState == 4说明请求已完成
    if (xhr.readyState == 4 && xhr.status == 200) {
      // 从服务器获得数据
      fn.call(this, xhr.responseText);
    }
  };
    xhr.send();
  }
}

axios实现
var Axios = {
  get: function(url) {
  return new Promise((resolve, reject) => {
  var xhr = new XMLHttpRequest();
  xhr.open('GET', url, true);
  xhr.onreadystatechange = function() {
    // readyState == 4说明请求已完成
    if (xhr.readyState == 4 && xhr.status == 200) {
      // 从服务器获得数据
      resolve(xhr.responseText)
    }
    };
    xhr.send();
   })
  },
}

ajxa和axios的区别的更多相关文章

  1. Jquery ajax, Axios, Fetch区别

    1.   Jquery ajax, Axios, Fetch区别之我见 2.   ajax.axios.fetch之间的详细区别以及优缺点

  2. vue-d2admin-axios异步请求登录,先对比一下Jquery ajax, Axios, Fetch区别

    先说一下对比吧 Jquery ajax, Axios, Fetch区别之我见 引言 前端技术真是一个发展飞快的领域,我三年前入职的时候只有原生XHR和Jquery ajax,我们还曾被JQuery 1 ...

  3. Jquery ajax, Axios, Fetch区别之我见(转载)

    来源:https://segmentfault.com/a/1190000012836882 引言 前端技术真是一个发展飞快的领域,我三年前入职的时候只有原生XHR和Jquery ajax,我们还曾被 ...

  4. vue-resource 和 axios的区别

    vue-resource Vue.js是数据驱动的,这使得我们并不需要直接操作DOM,如果我们不需要使用jQuery的DOM选择器,就没有必要引入jQuery.vue-resource是Vue.js的 ...

  5. Axios源码分析

    Axios是一个基于promise的HTTP库,可以用在浏览器和node.js中. 文档地址:https://github.com/axios/axios axios理解和使用 1.请求配置 { // ...

  6. 三种获取数据的方法fetch和ajax和axios

    一 .fetch用法 ( 本人比较喜欢fetch,代码精简,虽说目前axios比较流行,但是fetch很多大厂已经开始用fetch开始封装了, 我觉得以后fetch会取代axios和ajax ) 1. ...

  7. 基于Servlet的Echarts例子(2018-12-26更新)

    引子 ECharts是百度出品的,一个使用 JavaScript 实现的开源可视化库.程序员在Web页面上引入并稍作配置就能做出漂亮的数据图表. 本篇文章简单介绍一下如何在JSP中使用Echarts, ...

  8. 作业-JSP简单入门

    说明 本次作业不打分,仅作为大家自学的指导. 本次实验内容以"JSP实验参考文件"为主. 参考资料 Java教学问卷调查,有什么想说的,请尽情投票吧! 反射实验参考文件 JSP实验 ...

  9. 【巷子】---fetch---基本使用

    一.fetch fetch是一种XMLHttpRequest的一种替代方案,在工作当中除了用ajax获取后台数据外我们还可以使用fetch.axios来替代ajax 二.fetch的基本使用 1.np ...

随机推荐

  1. 微信小程序中的事件

    事件 说明 bindtap bindload 当图片载入完毕时触发,event.detail = {height, width} bind事件绑定不会阻止冒泡事件向上冒泡,catch事件绑定可以阻止冒 ...

  2. 2017-2018 ACM-ICPC Southeastern European Regional Programming Contest (SEERC 2017)

    2017-2018 ACM-ICPC Southeastern European Regional Programming Contest (SEERC 2017) 全靠 wxh的博客 补完这套.wx ...

  3. docker概述和安装及基本操作

    一:概述 Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,然后发布到任何流行的Linux机器或Windows 机器上,也可以实现虚拟化,容器是完全使用 ...

  4. Codeforces Round 564 题解

    很抱歉让标题把您骗进来了. 这是一场打得最失败的div1. 作为一个橙名一题都不会…… 旁边紫名的PB怒切3题,div2的也随便玩玩出了div1b/div2d…… 这名字颜色也太有水分了. 也就只会2 ...

  5. IDEA Gradle配置与使用

    1.安装Gradle,并添加环境变量. https://www.cnblogs.com/NyanKoSenSei/p/11458953.html 2.在IDEA中设置Gradle: 3.选中项目中的. ...

  6. MySQL统计百分比结果

    1,不带小数点的百分比 SELECT CONCAT(ROUND(errorTable.errorCount / totalTable.totalCount * 100),'','%') FROM (S ...

  7. MySQL5.7调优参数

    1. 更改MySQL Data File位置 datadir=/data/mysqlsocket=/data/mysql/mysql.sock 2. 调整OS参数 * soft nproc 10240 ...

  8. kafka参数解析+启动参数解析

    Kafka参数详解 每个kafka broker中配置文件server.properties默认必须配置的属性如下: broker.id=0 num.network.threads=2 num.io. ...

  9. Java选择结构和循环结构

    1.选择结构 ①.ifif(){ } if(){}else{} if(){}else if(){}else if(){}else{} ②.switch switch (表达式) { case 常量 1 ...

  10. [转帖]Kubernetes v1.17 版本解读 | 云原生生态周报 Vol. 31

    Kubernetes v1.17 版本解读 | 云原生生态周报 Vol. 31 https://www.kubernetes.org.cn/6252.html 2019-12-13 11:59 ali ...