首页 > 解决方案 > 如何在 Javascript 中循环 JSON 响应以获取特定数据

问题描述

我正在学习如何使用 Javascript 发出 API 请求。

我提出了一个 GET 请求并获得了以下数据,我想遍历它们以仅获取iddisplay_nameemail。这将存储在数组中。如何完成 javascript 代码?

"data": [
        {
            "id": 222226,
            "display_name": "jane Doe",
            "email": "janeDoe@testmail.com",
        },
        {
            "id": 1111226,
            "display_name": "james",
            "email": "james@testmail.com",
        },
    {
            "id": 11126,
            "display_name": "Travis Mc",
            "email": "travis@testmail.com",
         },

这是我的javascript代码。

var options = {
        method: 'get',
        headers: {
            Authorization: 'Bearer ' + auth
        }
    };
    var response= UrlFetchApp.fetch(url, options);
    var data = JSON.parse(response.getContentText());

我不确定我是否正确地执行此循环部分。

for (var i = 0; i < data.length; i++) {
    Logger.log(data[i].display_name);
}

在此处输入图像描述

标签: javascriptarraysjsonloopsurlfetch

解决方案


我将假设您正在使用Fetch Api。如果是这样,这意味着您正在创建一个 Promise。使用 Promise 时,您必须链接then函数来确定如何进行。 Promise.then((value)=>{ /* do something */ }); 由于您使用的是 JSON 数据,因此您必须先对其进行解析,然后才能对 javascript 进行操作。如果您阅读 Fetch Api,它会解释它如何解决您的承诺并根据HTTP Response返回一个Response

这个例子是从 Devloper Mozilla Org 借来的 查看 Fetch API 的使用部分

fetch('http://example.com/movies.json')
  .then((response) => {
    return response.json();
  })
  .then((myJson) => {
    console.log(myJson);
  });

此示例说明了 fetch 函数如何解析返回响应的 promise,该响应被解析然后再次返回到另一个then函数,该函数现在将准备好处理已解析的数据。

在您的情况下,代码将如下所示

var options = {
    method: 'get',
    headers: {
        Authorization: 'Bearer ' + auth
    }
};

var response = UrlFetchApp.fetch(url, options)
.then((r)=>{ return r.json(); }).then((data)=>{
  for (let i = 0; i < data.length; i++) {
    Logger.log(data[i].display_name);
  }
});

推荐阅读