首页 > 编程知识 正文

axios是ajax技术吗,axios和jquery ajax区别

时间:2023-05-03 13:22:19 阅读:192229 作者:1313

1.区别

axios是通过promise实现对ajax技术的一种封装,就像jQuery实现ajax封装一样。

简单来说: ajax技术实现了网页的局部数据刷新,axios实现了对ajax的封装。

axios是ajax ajax不止axios。

下面列出代码来对比一下:

axios:

1、用于浏览器和node环境下的http请求,基于promise异步

2、可以自动将数据转换为json格式

3、支持防止CSRF( 跨站请求伪造)

axios({ url: '/getUsers', method: 'get', responseType: 'json', // 默认的 data: { //'a': 1, //'b': 2, } }).then(function (response) { console.log(response); console.log(response.data); }).catch(function (error) { console.log(error); })

ajax:

传统 Ajax 指的是 XMLHttpRequest(XHR)
1:原生ajax的创建:
var xhr = new XmlHttpRequest();
2:获取ajax对象,并接收返回
xhr.onreadystatechange = function(){
if(this.readystatus == 4 ){
console.log(this.responsetext); //readystate为4代表成功接收到返回
}
}
xhr.open(‘get’,url,false); //false代表同步,true代表异步

最早出现的发送后端请求技术,隶属于原始js中,核心使用XMLHttpRequest对象,多个请求之间如果有先后关系的话,就会出现回调地狱。

JQuery ajax 是对原生XHR的封装,除此以外还增添了对JSONP的支持。经过多年的更新维护,真的已经是非常的方便了,优点无需多言;如果是硬要举出几个缺点,那可能只有:

1.本身是针对MVC的编程,不符合现在前端MVVM的浪潮

2.基于原生的XHR开发,XHR本身的架构不清晰。

3.JQuery整个项目太大,单纯使用ajax却要引入整个JQuery非常的不合理(采取个性化打包的方案又不能享受CDN服务)

4.不符合关注分离(Separation of Concerns)的原则

5.配置和调用方式非常混乱,而且基于事件的异步模型不友好。

$.ajax({ url: '/getUsers', type: 'get', dataType: 'json', data: { //'a': 1, //'b': 2, }, success: function (response) { console.log(response); } })

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。