前端 JavaScript 进阶面试题, JavaScript 中异步编程的实现方式有哪些?

Step 1

Q:: JavaScript 中异步编程的实现方式有哪些？

A:: JavaScript 中异步编程的实现方式主要有以下几种：

1. 回调函数（Callback）：最基本的异步编程方式，通过将回调函数作为参数传递给异步操作，异步操作完成后调用回调函数。

2. Promise：通过 Promise 对象管理异步操作的结果，可以通过 .then()、.catch() 和 .finally() 方法进行链式调用，避免了回调地狱的问题。

3. async/await：基于 Promise 的语法糖，使异步代码看起来更像同步代码，更加易读和易维护。使用 async 关键字定义异步函数，使用 await 关键字等待异步操作完成。

Step 2

Q:: 什么是回调地狱（Callback Hell），如何避免？

A:: 回调地狱是指在使用回调函数进行异步编程时，回调函数嵌套过深导致代码难以阅读和维护。避免回调地狱的方法有：

1. 使用命名函数代替匿名回调函数，提高代码的可读性。

2. 使用 Promise 或 async/await 替代回调函数，进行更清晰的异步操作管理。

3. 将嵌套的异步操作拆分成单独的函数或模块，减少嵌套层级。

Step 3

Q:: Promise 的状态有哪些？

A:: Promise 有三种状态：

1. pending：初始状态，表示异步操作尚未完成。

2. fulfilled：表示异步操作成功完成，且有一个结果值。

3. rejected：表示异步操作失败，且有一个拒绝原因。

Step 4

Q:: 如何处理多个 Promise 的并行执行？

A:: 可以使用 Promise.all() 或 Promise.race() 方法处理多个 Promise 的并行执行。

1. Promise.all()：接受一个 Promise 数组，当所有 Promise 都成功时返回一个包含所有结果的数组，如果有任何一个 Promise 失败，则返回失败的 Promise。

2. Promise.race()：接受一个 Promise 数组，当第一个 Promise 完成（无论成功还是失败）时返回这个 Promise 的结果。

Step 5

Q:: 什么是 async/await？如何使用？

A:: async/await 是基于 Promise 的语法糖，使得异步代码看起来像同步代码。async 用于定义一个异步函数，await 用于等待一个 Promise 完成。

示例：

 
async function fetchData() {
  try {
    const response = await fetch('https://api.example.com/data');
    const data = await response.json();
    console.log(data);
  } catch (error) {
    console.error(error);
  }
}
 
fetchData();