Ajax、Axios和Fetch都是用于发送HTTP请求的工具，但它们之间有一些关键的区别：
- 浏览器兼容性：Ajax是基于原生XHR（XMLHttpRequest）对象的，而Fetch和Axios都是基于Promise的。因此，Axios在旧浏览器中可能不可用，而Fetch则提供了一个polyfill，可以用于不支持Fetch的旧浏览器。
- 功能完善程度：Axios提供了请求和响应拦截功能，这在处理如认证、错误处理等场景中非常有用。另一方面，Fetch提供了更为原生的Promise支持，并且在处理复杂的请求时，如需要取消请求或处理响应数据时，代码会相对复杂一些。
- 使用复杂度：Axios的语法更直观，使用起来更简洁。而Fetch的语法则更接近原生JavaScript，需要手动处理响应和错误。
撤回请求：
- 使用Axios，你可以取消整个请求操作：
const source = axios.CancelToken.source();
axios.get('/api/data', { cancelToken: source.token }).catch(function(thrown) {
if (axios.isCancel(thrown)) {
console.log('Request canceled', thrown.message);
} else {
// handle other errors
}
});
// 在需要的时候取消请求
source.cancel('Operation canceled by the user.');- 使用Fetch，你可以通过返回的Promise对象的abort方法来取消请求：
const controller = new AbortController();
const signal = controller.signal;
fetch('/api/data', { signal }).then(response => response.json())
.then(data => console.log(data))
.catch(e => console.log(e.message === "The operation was aborted."); // true);
// 在需要的时候取消请求
controller.abort();防抖节流：
- 防抖：指的是在频繁的事件触发下，只让最后一次事件生效，取消之前的事件。
- 节流：指的是在频繁的事件触发下，让事件一定时间内只触发一次。
防抖示例（使用lodash的debounce函数）：
import debounce from 'lodash/debounce';
const debouncedFunction = debounce(() => {
// 处理逻辑
}, 200);
element.addEventListener('click', debouncedFunction);节流示例（使用lodash的throttle函数）：
import throttle from 'lodash/throttle';
const throttledFunction = throttle(() => {
// 处理逻辑
}, 1000);
element.addEventListener('mousemove', throttledFunction);防抖和节流是通过高阶函数来实现的，可以减少高频事件导致的性能问题。在实际开发中，可以使用lodash或者underscore这样的库来简化代码。