调用Wikipedia OpenSearch API报错：TypeError: 无法读取undefined的属性'3'

你遇到的这个TypeError: Cannot read property '3' of undefined错误，核心问题是你误解了Wikipedia OpenSearch API的返回结构。

先看你的代码里的问题：你尝试访问data.results[3][1]，但实际上OpenSearch API返回的响应根本没有results这个属性——它直接返回一个纯数组，所以data.results是undefined，自然没法读取它的[3]索引。

先搞懂OpenSearch API的返回结构 #

当你调用https://en.wikipedia.org/w/api.php?&origin=*&action=opensearch&search=Teatr Wielki&limit=5时，返回的JSON是一个长度为4的数组，结构是这样的：

[
  "Teatr Wielki", // 你传入的搜索关键词
  ["Teatr Wielki", "Teatr Wielki (Poznań)", ...], // 匹配的页面标题数组
  ["", "Teatr Wielki in Poznań is...", ...], // 对应标题的简短描述数组
  ["https://en.wikipedia.org/wiki/Teatr_Wielki", ...] // 对应页面的URL数组
]

修正你的代码 #

你需要直接操作返回的数组，而不是去访问不存在的results属性。下面是修正后的完整代码，同时优化了空描述的处理：

function getInfo() { 
  let search = "Teatr Wielki"; 
  fetch("https://en.wikipedia.org/w/api.php?&origin=*&action=opensearch&search=" + search + "&limit=5", { 
    headers: { 'Accept': 'application/json', }, 
  })
  .then(response => response.json()) 
  .then(addInfo) 
  .catch (e => requestError(e)); 

  function addInfo(data) { 
    console.log(data); // 这里可以打印出完整的返回数组，确认结构
    // 获取所有描述的数组（对应返回数组的第2个索引，从0开始）
    const descriptionList = data[2];
    // 找到第一个非空的描述
    const info = descriptionList.find(desc => desc.trim() !== '');
    if (info) {
      document.querySelector('#results').innerHTML = info;
    } else {
      document.querySelector('#results').innerHTML = 'Unfortunately, no info was returned for this data.';
    }
  } 

  function requestError(e, part) { 
    console.log(e); 
    document.querySelector('#results').innerHTML = '<br>Oh no! There was an error making a request for this place'; 
  } 
}

为什么之前的索引尝试没用？ #

你之前试了[0]、[1]等索引，但都是在data.results上操作，而data.results本身就是undefined，所以不管用什么索引都会报错。现在直接用data[0]、data[1]就能访问到返回数组里的对应内容了。

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