axios和ajax的区别是什么

img

axios和ajax的区别:
1、axios是一个基于Promise的HTTP库,而ajax是对原生XHR的封装;
2、ajax技术实现了局部数据的刷新,而axios实现了对ajax的封装。

axios和ajax的区别是什么?

axios和ajax的区别及优缺点:

ajax:

1、什么是ajax

Ajax是对原生XHR的封装,为了达到我们跨越的目的,增添了对JSONP的支持。

异步的javascript和xml,ajax不是一门新技术,而是多种技术的组合,用于快速的创建动态页面,能够实现无刷新更新数据从而提高用户体验。

2、ajax的原理?

由客户端请求ajax引擎,再由ajax引擎请求服务器,服务器作出一系列响应之后返回给ajax引擎,由ajax引擎决定将这个结果写入到客户端的什么位置。实现页面无刷新更新数据。

3、核心对象?

XMLHttpReques

4、ajax优缺点?

优点

1、 无刷新更新数据

2、异步与服务器通信

3、前端和后端负载平衡

4、基于标准被广泛支持

5、界面与应用分离

缺点:

1、ajax不能使用Back和history功能,即对浏览器机制的破坏。

2、安全问题 ajax暴露了与服务器交互的细节

3、对收索引擎的支持比较弱

4、破坏程序的异常处理机制

5、违背URL和资源定位的初衷

6、ajax不能很好的支持移动设备

7、太多客户端代码造成开发上的成本

5、Ajax适用场景
  <1>.表单驱动的交互
  <2>.深层次的树的导航
  <3>.快速的用户与用户间的交流响应
  <4>.类似投票、yes/no等无关痛痒的场景
  <5>.对数据进行过滤和操纵相关数据的场景
  <6>.普通的文本输入提示和自动完成的场景
6、Ajax不适用场景
  <1>.部分简单的表单
  <2>.搜索
  <3>.基本的导航
  <4>.替换大量的文本
  <5>.对呈现的操纵

7、代码

$.ajax({type: 'POST',url: url,data: data,dataType: dataType,success: function () {},error: function () {}});

8、ajax请求的五个步骤

1. 创建XMLHttpRequest异步对象

2. 设置回调函数

3. 使用open方法与服务器建立连接

4. 向服务器发送数据

5. 在回调函数中针对不同的响应状态进行处理

axios:

1、axios是什么

Axios 是一个基于 Promise 的 HTTP 库,可以用在浏览器和 node.js 中。

2、axios有那些特性?

1、在浏览器中创建 XMLHttpRequests

2、在node.js则创建http请求

3、支持Promise API

4、支持拦截请求和响应

5、转换请求和响应数据

6、取消请求

7、自动转换成JSON数据格式

8、客户端支持防御XSRF

3、执行get请求,有两种方式

// 第一种方式  将参数直接写在url中axios.get('/getMainInfo?id=123').then((res) => {console.log(res)}).catch((err) => {console.log(err)})// 第二种方式  将参数直接写在params中axios.get('/getMainInfo', {  params: {id: 123}}).then((res) => {console.log(res)}).catch((err) => {console.log(err)})

4、执行post请求,注意执行post请求的入参,不需要写在params字段中,这个地方要注意与get请求的第二种方式进行区别。

axios.post('/getMainInfo', {id: 123}).then((res) => {console.log(res)}).catch((err) => {console.log(err)})

axios和ajax的区别:

axios是通过Promise实现对ajax技术的一种封装,就像jquery对ajax的封装一样,简单来说就是ajax技术实现了局部数据的刷新,axios实现了对ajax的封装,axios有的ajax都有,ajax有的axios不一定有,总结一句话就是axios是ajax,ajax不止axios。

注: 传统Ajax 指的是 XMLHttpRequest(XHR),
  axios和jQuer ajax都是对Ajax的封装

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/554887.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

telnet linux 命令详解,解析Linux Telnet命令

不少系统中&#xff0c;都有Telnet的相关涉及和使用。那么今天我们就来讲解一下Linux Telnet命令的相关使用和操作。这里我们针对一些重点的内容和命令进行讲解。希望对大家有所帮助。用户使用Telnet命令进行远程登录。该命令允许用户使用Telnet协议在远程计算机之间进行通信&a…

VUE学习笔记详细

VUE学习笔记 本文章以vue3来记录的&#xff0c;但并非记录vue3所有变化&#xff01; 1、ES6语法 1.1、let变量声明 let用于声明变量有局部作用域let声明的变量不会提升&#xff08;只能先定义后使用&#xff09; 1.2、const变量声明 const用于声明常量const声明的常量也不会…

C语言2020年作业,2020年c语言上机报告范文【四篇】

《2020年c语言上机报告范文【四篇】》由会员分享&#xff0c;可在线阅读&#xff0c;更多相关《2020年c语言上机报告范文【四篇】(7页珍藏版)》请在人人文库网上搜索。1、2020 年 c 语言上机报告范文【四篇】2020 年 c 语言上机报告范文一说到我学习 C 语言时&#xff0c;真是用…

Centos7配置gitlab服务器

Centos7配置gitlab服务器 1、安装SSH yum install -y curl policycoreutils-pythonopenssh-server设置开机自启 sudo systemctl enable sshd启动服务 sudo systemctl start sshd2、安装postfix 邮件服务 sudo yum install postfix设置开机自启 sudo systemctl enable po…

湖南工大11级C语言网上作业,湖南工大11级C语言网上作业之《最简单的程序设计》.docx...

《程序设计语言 C1》随机作业题做作业时间&#xff1a;2012-3-9 8:00:00至2012-5-29 23:30:00?1、以下程序的输出结果是 main() { char cz; printf("%c",c-25); } (3分)A、B、C、D、A、aB、ZC、z-25D、y?2、以下程序段的输出结果是 char s[]"\\141\141abc\t&q…

Jenkins学习笔记详细

最近接触了jenkins这个东西&#xff0c;所以花点时间了解了下。它可以在代码上传仓库&#xff08;如github,gitee&#xff0c;gitlab&#xff09;后&#xff0c;在jenkins&#xff08;一个网站界面&#xff09;中通过获取代码仓库中最新代码&#xff0c;进行自动化部署&#xf…

c语言程序设计华北电力大学,2016年华北电力大学电气与电子工程学院C语言程序设计(同等学力加试)考研复试题库...

一、选择题1&#xff0e; 有以下程序程序运行后的输出结果是( )。A.24B.44C.22D.46答:B【解析】p 是int 类型的指针&#xff0c;指向数组a 的首元素&#xff1b;k 的int*类型的指针&#xff0c;指向int*变量先执行p&#xff0c;p 指向a 中第二个元素&#xff0c;然后取值&#…

Form Data与Request Payload,你真的了解吗?

前言 做过前后端联调的小伙伴&#xff0c;可能有时会遇到一些问题。例如&#xff0c;我明明传递数据给后端了&#xff0c;后端为什么说没收到呢&#xff1f;这时候可能就会就会有小伙伴陷入迷茫&#xff0c;本文从chrome-dev-tools&#xff08;F12调试器&#xff09;中看到的F…

c语言运行程序导出表格,C语言--输出打印表格

//// invest.c// day05//// 打印一个投资利率表// 打印100元在指定年份内投资&#xff0c;按相应回报率计算收益 &#xff0c;程序输出如下:// 利率: 6%年份:5//// Year 6%7% 8% 9% 10%// 1 106 107 108 109 110// 2 112.36 114.49 116.64 118.81 121// 3 119.10 122.50 125.97…

Java对象复制或拷贝之BeanUtils.copyProperties() 用法,一行语句实现对象间快速复制

java对象复制或拷贝之BeanUtils.copyProperties() 用法&#xff0c;一行语句实现对象间快速复制 即 BeanUtils.copyProperties(源对象, 目标对象); 使用注意事项&#xff1a; 1.BeanUtils是org.springframework.beans.BeanUtils&#xff0c;不是org.apache.commons.beanutils.…

c语言c98标准,1.3.2 C语言标准

1.3.2 C语言标准Dennis Ritchie和Brian Kernighan的经典著作《C程序设计语言》(Prentice Hall)自1978年***出版后&#xff0c;一直扮演着非正式的C语言规范的角色。这个版本的C语言俗称K&R C。C语言很快替代了Basic语言和其他语言&#xff0c;成为微型计算机编程的通用语言…

计算机网络知识点复习

基础 1.说下计算机网络体系结构 计算机网络体系结构&#xff0c;一般有三种&#xff1a;OSI 七层模型、TCP/IP 四层模型、五层结构。 简单说&#xff0c;OSI是一个理论上的网络通信模型&#xff0c;TCP/IP是实际上的网络通信模型&#xff0c;五层结构就是为了介绍网络原理而折…

单链表插入元素 注释 c语言,数据结构之无头单链表的相关练习题——C语言实现(详细注释)...

本文中所用到的相关链表操作实现均在我上篇博客中&#xff1a;https://blog..net/haoziai905/article/details/870992871.删除无头单链表的非尾结点这道题的重点就在于最后的非尾结点上&#xff0c;既然是非尾结点&#xff0c;则说明其下一个结点必定不为空。而我们通常所使用的…

n个1组成的整数能被2013整除c语言,求大神解算法,“编写程序,求n至少为多大时,n个1组成的整数能被2013 整除。”...

编写程序&#xff0c;求n至少为多大时&#xff0c;n个1组成的整数能被2013 整除。使用python黑科技:i 1while int(1 * i) % 2013:i 1print(i)不使用黑科技:i s t 1while s % 2013:i 1t t * 10 % 2013s (s t) % 2013print(i)而事实上可以从数论的角度看。20133*11*61&a…

Java基础知识点复习

转载&#xff1a;https://mp.weixin.qq.com/s/M-6RSRcRd3X93cR7VXpanw Java概述 1.什么是Java&#xff1f; Java是一门面向对象的编程语言&#xff0c;不仅吸收了C语言的各种优点&#xff0c;还摒弃了C里难以理解的多继承、指针等概念&#xff0c;因此Java语言具有功能强大和…

c语言 求2到100的素数,2是素数吗(c语言输出100以内素数)

2是质数吗&#xff1f;除了1和本身外&#xff0c;不能被其他任何自然数整数的自然数。又叫做素数&#xff0c;最小的素数是2&#xff0c;也是唯一的偶质数 100以内的质数共有25个&#xff0c;这些质数我们经常用到&#xff0c;可以用下面的.1不是素数&#xff0c;最小的质数是2…

为什么都说Dubbo不适合传输大文件?Dubbo支持的协议

背景 之前公司有一个 Dubbo 服务&#xff0c;内部封装了腾讯云的对象存储服务 SDK&#xff0c;是为了统一管理这种三方服务的SDK&#xff0c;其他系统直接调用这个对象存储的 Dubbo 服务。用来避免因平台 SDK 出现不兼容的大版本更新&#xff0c;导致公司所有系统修改跟着升级…

中科院C语言应聘机试编程题6,中科院计算所保研笔试+机试+面试经验分享

计算所JDL(先进人机交互)实验室9月10号开始联系计算所导师&#xff0c;12号收到导师的回复&#xff0c;大致意思是老师让我提供三位本校推荐老师的联系方式&#xff0c;又问了是否有读博的打算&#xff0c;让我准备到计算所JDL面试&#xff0c;16号收到了他们的正式通知。老实说…

MySQL group_concat()详解

GROUP_CONCAT(xxx)&#xff1a;是将分组中括号里对应的字符串进行连接.如果分组中括号里的参数xxx有多行&#xff0c;那么就会将这多行的字符串连接&#xff0c;每个字符串之间会有特定的符号进行分隔。 对应的语法格式 # 将分组中column1这一列对应的多行的值按照column2 升序…

c语言编写劫持dll,c语言-----劫持自己02

在上一节 c语言-----劫持原理01 已经叙述了劫持原理&#xff0c;下边正式进入劫持实战1. 需要实现的功能在c语言中system("notepad") 可以打开一个记事本system("mspaint") 可以打开画图工具所以这次我们需要把 可以打开一个记事本 这个功能更改为 在控制…