前端异步操作示例：使用 Promise 和 async/await 获取用户信息

以下是一个前端异步操作的示例，使用 Promise 和 async/await 获取用户信息：

// 异步操作示例：获取用户信息
function getUserInfo(userId) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      const userInfo = {
        id: userId,
        name: 'John Doe',
        email: 'johndoe@example.com'
      };
      resolve(userInfo);
    }, 2000);
  });
}

// 使用异步操作获取用户信息
async function displayUserInfo(userId) {
  try {
    const userInfo = await getUserInfo(userId);
    console.log('User info:', userInfo);
    // 在这里可以进行后续操作，例如更新页面内容等
  } catch (error) {
    console.error('Error:', error);
  }
}

// 调用异步操作函数
displayUserInfo(123);

在上面的示例中，getUserInfo 函数是一个异步操作，它返回一个 Promise 对象。在这个函数内部，我们使用 setTimeout 模拟了一个异步的延迟操作，2 秒后返回用户信息。

displayUserInfo 函数使用 async/await 语法来处理异步操作。通过 await 关键字，我们可以等待 getUserInfo 函数的 Promise 对象完成，并将结果赋值给 userInfo 变量。如果异步操作成功，我们打印用户信息到控制台，并可以继续进行后续操作。如果异步操作失败，我们将错误信息打印到控制台。

最后，我们调用 displayUserInfo 函数来获取并展示具体用户的信息。在这个示例中，我们传递了一个用户 ID（123），但你可以根据实际需求传递不同的参数。