JavaScript中事件与回调本质相同:事件是异步信号,回调是响应函数;addEventListener需传函数引用而非调用结果;循环中注意闭包问题;Promise需分层处理HTTP状态与解析错误;setTimeout/setInterval中this需手动绑定;异步操作后DOM更新须置于.then或await之后。

JavaScript 中事件和回调不是两个独立概念,而是同一机制的不同表现:事件是异步触发的信号,回调是响应这个信号的函数。直接绑定、传递或返回函数即可,不需要额外“转换”。
addEventListener 的回调必须是函数引用,不能带括号
常见错误是写成 element.addEventListener('click', handleClick())——这会立即执行 handleClick 并把它的返回值(通常是 undefined)当回调传入,导致点击无反应。
正确做法是传函数名本身(不加括号),或用箭头函数包裹:
element.addEventListener('click', handleClick)-
element.addEventListener('click', () => handleClick(arg))(需传参时) - 避免在循环中用
for (let i = 0; i console.log(i) }——闭包问题会让所有按钮输出最后一个i值;改用let声明或forEach更安全
Promise.then 的回调接收 resolve 值,但不会自动传播错误
fetch 成功返回 Response 对象,但 response.json() 才真正解析 JSON;如果后端返回 500 状态码,fetch 仍算“成功”,必须手动检查 response.ok。
立即学习“Java免费学习笔记(深入)”;
本文档是Websphere教程;WebSphere 是因特网的基础架构软件,也就是我们所说的中间件。它使企业能够开发、部署和集成新一代电子商务应用(如 B2B 的电子交易),并且支持从简单的 Web 发布到企业级事务处理的商务应用。希望本文档会给有需要的朋友带来帮助;感兴趣的朋友可以过来看看
错误处理要分层:
-
.then(data => data.json())只处理解析逻辑,不捕获网络失败 -
.catch(err => console.error(err))捕获网络异常、JSON 解析失败等,但不捕获404或500这类 HTTP 错误 - 需要显式判断:
if (!response.ok) throw new Error(`${response.status} ${response.statusText}`)
setTimeout 和 setInterval 的回调没有 this 绑定
在对象方法中使用 setTimeout(this.handler, 100),回调执行时 this 指向 window(非严格模式)或 undefined(严格模式),不是原对象。
修复方式有三种:
- 用箭头函数:
setTimeout(() => this.handler(), 100) - 用
bind:setTimeout(this.handler.bind(this), 100) - 提前缓存
this:const self = this; setTimeout(function() { self.handler(); }, 100)
最易被忽略的是事件回调里的异步链:比如点击触发 API 调用,调用完成后再更新 DOM——很多人把 DOM 更新写在事件处理函数顶层,而不是放在 .then 或 async/await 的后续位置,结果更新发生在请求完成前。










