JavaScript

JavaScript异步编程有哪些常见模式

小樊
83
2024-11-02 05:55:19
栏目: 编程语言

JavaScript异步编程的常见模式有以下几种:

  1. 回调函数(Callback) 回调函数是异步编程中最常见的模式。在调用异步函数时,传递一个函数作为参数,当异步操作完成时,这个函数会被调用。例如:
function asyncOperation(callback) {
  setTimeout(() => {
    const result = '异步操作完成';
    callback(result);
  }, 1000);
}

asyncOperation((result) => {
  console.log(result); // 输出 "异步操作完成"
});
  1. Promise Promise 是 JavaScript 中用于处理异步操作的一种更高程度的抽象。Promise 可以将回调函数从异步操作中分离出来,使代码更加易读和易于维护。例如:
function asyncOperation() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      const result = '异步操作完成';
      resolve(result);
    }, 1000);
  });
}

asyncOperation()
  .then((result) => {
    console.log(result); // 输出 "异步操作完成"
  })
  .catch((error) => {
    console.error(error);
  });
  1. async/await async/await 是 JavaScript 中处理异步操作的另一种语法糖,它基于 Promise。通过使用 async 和 await 关键字,可以使异步代码看起来更像同步代码。例如:
async function main() {
  try {
    const result = await asyncOperation();
    console.log(result); // 输出 "异步操作完成"
  } catch (error) {
    console.error(error);
  }
}

main();
  1. 事件监听(Event Listener) 事件监听是另一种常见的异步编程模式,主要用于处理用户交互和系统事件。例如:
document.addEventListener('click', (event) => {
  console.log('按钮被点击了');
});
  1. 定时器(Timer) 定时器是用于在指定的时间后执行某个操作的异步编程模式。例如:
setTimeout(() => {
  console.log('定时器触发');
}, 1000);
  1. Promise.all() 和 Promise.race() Promise.all() 用于等待一组 Promise 全部完成,而 Promise.race() 用于等待一组 Promise 中的任意一个完成。例如:
const promise1 = new Promise((resolve) => setTimeout(resolve, 1000, 'one'));
const promise2 = new Promise((resolve) => setTimeout(resolve, 2000, 'two'));

Promise.all([promise1, promise2])
  .then((values) => {
    console.log(values); // 输出 ['one', 'two']
  })
  .catch((error) => {
    console.error(error);
  });

Promise.race([promise1, promise2])
  .then((value) => {
    console.log(value); // 输出 'one'
  })
  .catch((error) => {
    console.error(error);
  });

这些模式可以根据实际需求和场景进行选择和组合,以实现高效、易读的异步编程。

0
看了该问题的人还看了