Javascript 异步/等待函数的行为并不总是正确的

我正在开发一个react native/nodeJS项目，在使用异步/等待函数调用后端的Axios API时遇到了问题

代码如下：

const TimeTable = () => {
  const [attendedCourses, setAttendedCourses] = useState([]);
  const [courseSchedules, setCourseSchedules] = useState([]);

  useEffect(() => {
    getUserCourses();
    getCourseSchedule();
    console.log(courseSchedules);
  }, []);

  const getCourseSchedule = async () => {
    for (const item of attendedCourses) {
      try {
        const res = await axios.get(`/api/lesson/findById/${item.courseId}`);
        setCourseSchedules((prev) => [
          ...prev,
          {
            id: res.data._id,
            name: res.data.name,
            schedule: [...res.data.schedule],
          },
        ]);
      } catch (err) {
        const error = err.response.data.msg;
        console.log(error);
      }
    }
  };

  const getUserCourses = async () => {
    const userId = "12345678"; //hardcoded for testing purpose
    try {
      const res = await axios.get(`/api/users/lessons/${userId}`);
      setAttendedCourses(res.data);
    } catch (err) {
      const error = err.response.data.msg;
      console.log(error);
    }
  };

  return (...); //not important

};

export default TimeTable;

方法

getUserCourses（）

行为正确，并始终返回保存在

attendedCourses

状态中的对象数组。第二种方法

getCourseSchedule（）

无法正常工作。useffect（）中的console.log（）大部分时间打印空数组。

---

谁能给我解释一下原因吗？谢谢大家!

当方法是异步的时，实际的useffect不会以异步方式处理它，并且不会等到您到达useffect中的

控制台.log

。如果将console.log放入

getCourseSchedule

方法中，并在等待后记录结果，每次都会显示正确的结果

您混淆了每个方法的异步性质。您的代码不会在useffect中等待，而是在实际方法中等待，而useffect的其余部分则继续执行

如果确实希望在useEffect中看到结果，请尝试执行以下操作：

useEffect(() => {
  const apiCalls = async () => {
    await getUserCourses();
    await getCourseSchedule();
    console.log(courseSchedules);
  }

  apiCalls()
})

---

您的

useffect

有一个空数组作为依赖项，这意味着当

courseSchedules

具有初始值（空数组）时，它在初始渲染之前只运行一次

要查看

courseSchedules

的更改，应添加另一个

useEffect

，如下所示：

useffect（（）=>{
控制台日志（课程时间表）；
}，[课程表]因为在收到服务器的任何响应之前，您正在记录该值。请尝试
等待getUserCourses（）
和
等待getCourseSchedule（）
我使用console.log只是为了测试。实际上，我需要在
getUserCourses（）
和
getCourseSchedule（）
完成它们的工作之后执行一个函数。不管怎样，我仍然在控制台中看到一个空数组。还有其他解决办法吗@丹雅