箭头函数可写在网络请求拦截器中，适合简洁逻辑且无this绑定问题；请求拦截器推荐使用，响应拦截器需注意错误分支；类方法依赖this、需arguments或构造函数场景禁用。
箭头函数本身不能“写在网络请求拦截器里”，它只是函数的写法。真正起作用的是你用箭头函数定义的回调或处理逻辑，比如在 Axios 拦截器中设置请求/响应处理函数。关键在于：箭头函数适合写简洁的、不依赖 this 或 arguments 的逻辑，但要注意它没有自己的 this —— 在拦截器里这反而是优点（避免 this 绑定问题）。
✅ 请求拦截器中用箭头函数（推荐）
Axios 请求拦截器通常注册在实例上，箭头函数能自然捕获外层作用域变量，且不会干扰 this：
const api = axios.create({ baseURL: '/api' });
// ✅ 推荐：用箭头函数，简洁且 this 不会出错
api.interceptors.request.use(
(config) => {
const token = localStorage.getItem('token');
if (token) {
config.headers.Authorization = `Bearer ${token}`;
}
return config;
},
(error) => Promise.reject(error)
);
⚠️ 响应拦截器中用箭头函数（注意错误处理）
响应拦截器也常用箭头函数，但要注意：如果需要统一处理业务错误（如 401、500），别漏掉 error 分支：
api.interceptors.response.use(
(response) => response.data, // 直接取 data，常见简化写法
(error) => {
if (error.response?.status === 401) {
localStorage.removeItem('token');
window.location.href = '/login';
}
return Promise.reject(error);
}
);
❌ 不要用箭头函数的场景
极少数情况需访问原生事件对象或特殊上下文（比如在某些封装的拦截器类中显式依赖 this），此时必须用普通函数：
立即学习“Java免费学习笔记（深入）”；
- 类方法中定义拦截器且内部用到了
this.xxx（箭头函数会丢失类实例绑定） - 需要使用
arguments对象（箭头函数没有arguments） - 需要
new.target或super（箭头函数不能作为构造函数）
? 小技巧：配合 async/await 写更清晰
箭头函数 + async 很自然，适合处理异步逻辑（如刷新 token）：
api.interceptors.response.use(
(res) => res,
async (error) => {
const originalRequest = error.config;
if (error.response?.status === 401 && !originalRequest._retry) {
originalRequest._retry = true;
const newToken = await refreshToken(); // 假设这是个异步函数
originalRequest.headers.Authorization = `Bearer ${newToken}`;
return api(originalRequest);
}
return Promise.reject(error);
}
);
