
同步编程是 javascript 中的一个重要概念,使您能够在不阻塞主线程的情况下处理 api 调用、文件读取和计时器等操作。如果您对这个概念不熟悉或想巩固您的理解,这篇文章适合您!
什么是异步编程?
在同步编程中,任务是一个接一个执行的,这可能会导致资源使用效率低下,尤其是在处理需要时间的操作(如网络请求)时。异步编程允许您的代码在等待这些操作完成的同时运行,从而提高性能和响应能力。
关键概念
- 回调
- 承诺
- 异步/等待
让我们逐一分解这些概念。
立即学习“Java免费学习笔记(深入)”;
1。回调
回调是作为参数传递给另一个函数的函数,并在任务完成后执行。虽然简单,但当您有嵌套函数时,回调可能会导致“回调地狱”。
function fetchdata(callback) {
settimeout(() => {
const data = "data received!";
callback(data);
}, 1000);
}
fetchdata((data) => {
console.log(data); // output: data received!
});
**2。承诺
**promise 提供了回调的更清晰的替代方案。 promise 代表了一个可能现在可用、将来可用、或者永远不可用的值。它可以处于三种状态之一:待处理、已完成或已拒绝。
以下是如何使用 promise:
function fetchdata() {
return new promise((resolve, reject) => {
settimeout(() => {
const data = "data received!";
resolve(data); // or reject(error);
}, 1000);
});
}
fetchdata()
.then((data) => {
console.log(data); // output: data received!
})
.catch((error) => {
console.error(error);
});
**3。异步/等待
es2017 中引入的 async 和 wait 提供了一种更易读的方式来处理 promise。您将一个函数定义为异步,并且在该函数中,您可以使用await 暂停执行,直到解决promise。
async function fetchdata() {
return new promise((resolve) => {
settimeout(() => {
resolve("data received!");
}, 1000);
});
}
async function getdata() {
try {
const data = await fetchdata();
console.log(data); // output: data received!
} catch (error) {
console.error(error);
}
}
getdata();
错误处理
使用异步代码时,正确的错误处理至关重要。有了promise,你可以使用.catch(),有了async/await,你可以使用try/catch块。
现实世界的例子
让我们把它放在上下文中。下面是使用 fetch 从 api 获取数据的示例,它返回一个 promise:
async function fetchUserData(userId) {
try {
const response = await fetch(`https://jsonplaceholder.typicode.com/users/${userId}`);
if (!response.ok) {
throw new Error("Network response was not ok");
}
const userData = await response.json();
console.log(userData);
} catch (error) {
console.error("Fetch error:", error);
}
}
fetchUserData(1);
结论
javascript 中的异步编程允许您编写高效且响应迅速的代码。通过掌握回调、promise 和 async/await,您将能够优雅地处理异步操作。









