ajax和axios的区别

1.两种方法请求接口代码

axios

axios({
　　url: '接口地址',
　　method: 'get/post',
　　responseType: 'json', // 默认格式
　　data: {
　　　　"参数名" : "参数值"
　　}
}).then(function (response) {
　　console.log(response);
}).catch(function (error) {
　　console.log(error);
}）

ajax

$.ajax({
　　url: '接口地址',
　　type: 'get/post',
　　dataType: 'json',
　　data: {
　　　　"参数名" : "参数值"
　　}, 
　　success: function (response) { 
　　　　console.log(response)； 
　　} 
})

两者基本使用相似，axios是通过promise实现对ajax技术的一种封装，就像jQuery实现ajax封装一样。

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

2.优缺点

ajax：

1、本身是针对MVC编程，不符合前端MVVM的浪潮。

2、基于原生XHR开发，XHR本身的架构不清晰，已经有了fetch的替代方案，jquery整个项目太大，单纯使用ajax却要引入整个jquery非常不合理（采取个性化打包方案又不能享受cdn服务）

3、ajax不支持浏览器的back按钮。

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

5、对搜索引擎的支持比较弱。

6、破坏程序的异常机制。

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

 

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

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

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

4.不符合关注分离（Separation of Concerns）的原则

axios：

1.从浏览器中创建 XMLHttpRequest

2.支持 Promise API

3.客户端支持防止CSRF

4.提供了一些并发请求的接口（重要，方便了很多的操作）

5.从 node.js 创建 http 请求

6.拦截请求和响应

7.转换请求和响应数据

8.取消请求

9.自动转换JSON数据

若有不对欢迎评论区留言指正。