如何从objectIDs数组提取10个ID并转为[ID,ID,...]格式数组？

API 探路者

2026-8-6

问题分析与解决方案

原代码的核心问题

异步时序错误：fetch是异步操作，外部的console.log(idArr)会在请求返回前执行，此时idArr还是空数组，无法获取正确结果。
数组操作错误：循环中使用idArr.unshift(data.objectIDs)，是把整个objectIDs数组作为单个元素插入idArr，循环10次后会得到一个包含10个重复大数组的嵌套结构，完全不符合[ID, ID,...]的预期格式。

修正方案

直接通过数组slice方法提取前10个ID，同时正确处理异步逻辑：

方案1：使用async/await（代码更清晰）

async function getObjectIds() {
  try {
    const response = await fetch("https://collectionapi.metmuseum.org/public/collection/v1/search?hasImages=true&q=early renaissance");
    const data = await response.json();
    // 提取前10个ID，直接得到普通数组格式
    const idArr = data.objectIDs.slice(0, 10);
    console.log(idArr);
    return idArr;
  } catch (error) {
    console.error('请求出错:', error);
    return [];
  }
}

// 调用并处理结果
getObjectIds().then(idArr => {
  // 在这里使用整理好的ID数组
  console.log('最终ID数组:', idArr);
});

方案2：使用Promise链式调用

function getObjectIds() {
  fetch("https://collectionapi.metmuseum.org/public/collection/v1/search?hasImages=true&q=early renaissance")
    .then(response => response.json())
    .then(data => {
      // 直接截取前10个元素，无需循环
      const idArr = data.objectIDs.slice(0, 10);
      console.log(idArr);
      // 后续业务逻辑可在这里处理idArr
    })
    .catch(error => console.error('请求失败:', error));
}

getObjectIds();