调用getFavourites返回Promise而非数组，无法访问电影ID数组

问题本质 #

fetch 是异步API，你的getFavourites函数返回的必然是Promise对象——异步操作不会立刻返回结果，而是通过Promise来承载未来会拿到的最终数据，这是异步编程的正常表现。

两种可行解决方案 #

方案1：用 .then() 链式调用取结果 #

调用getFavourites时，通过.then()接收异步完成后的数组：

getFavourites('目标用户名')
  .then(favouritesArray => {
    // 在这里直接使用数组，比如渲染收藏电影列表
    console.log(favouritesArray);
  })
  .catch(error => {
    // 处理请求失败、token无效等异常情况
    console.error('获取收藏列表失败:', error);
  });

方案2：用 async/await 语法（更直观） #

如果调用getFavourites的函数本身是async函数，可通过await等待Promise完成：

// 定义一个async函数
async function loadUserFavourites() {
  try {
    const favouritesArray = await getFavourites('目标用户名');
    // 直接操作数组
    console.log(favouritesArray);
  } catch (error) {
    console.error('获取收藏列表失败:', error);
  }
}

// 执行函数
loadUserFavourites();

额外优化建议 #

你的getFavourites函数可以简化，同时增加响应状态校验，避免非成功状态下解析JSON出错：

export const getFavourites = (username) => {
  return fetch(`/api/users/${username}/favourites`, {
    headers: {
      'Authorization': window.localStorage.getItem('token')
    }
  })
  .then(res => {
    if (!res.ok) {
      throw new Error(`请求失败，状态码：${res.status}`);
    }
    return res.json();
  });
};

内容的提问来源于stack exchange，提问作者MichaelLong102