使用不工作javascript的平台图的json API响应代码

Question

Problem我试图从我检索数据的API中返回不包含filteredEmployers列表中任何名称的对象，并针对雇主属性返回。

我尝试过的----当我没有连接到API (即从硬编码的数据中读取)时，它似乎工作得很好，但是当我连接到API时，即使我得到了下面的响应(在检索后立即记录)，代码就不会执行…

{
    "Pagination": {
        "NumberOfPeople": 185,
        "PageSize": 200,
        "PageNumber": 1,
        "NumberOfPages": 1
    },
    "People": [
        {
            "name": "TJ",
            "job": "Software Engineer",
            "organization": {
                "company": {
                    "employer": "amazon",
                    "department": "IT"
                }
            },
            "location": {
                "city": "Boston",
                "state": "Massachusetts"
            }
        },
        {
            "name": "Dominique",
            "job": "CEO",
            "organization": {
                "company": {
                    "employer": "IBM",
                    "department": "IT"
                }
            },
            "city": "Seattle",
            "state": "Washington"
        },
        {
            "name": "Enrique",
            "job": "Engineer",
            "organization": {
                "company": {
                    "employer": "Bellkrieg Megasystems",
                    "department": "Construction"
                }
            },
            "location": {
                "address": {
                    "state": "New York",
                    "city": "New York City",
                    "zip": "11323"
                }
            }
        },
        {
            "name": "Bob",
            "job": "Project Manager",
            "organization": {
                "company": {
                    "employer": "Megasystems",
                    "department": "R&D"
                }
            },
            "address": {
                "location": {
                    "quadrant": {
                        "block": 1,
                        "state": "Texas",
                        "city": "Austin"
                    }
                }
            }
        }
    ]
}

我试图实现的代码如下：

// constants and variables are defined here, including API credentials and the filteredEmployers array
//FYI const filteredEmployers = ['Megasystems', 'Bellkrieg'];
//the code then fetches the API data is here
.then((response) => {
    return response.json();
})
.then((json) => {
    //console.log(typeof json);
    //console.log(json);
    const people = Array.from(json).flatMap(o => o.People);
    return people.filter(person => {
        const employer = person?.organization?.company?.employer;

        if (typeof employer !== 'string') return true;
        const employerIsNotFiltered = filteredEmployers.every(
            str => !employer.includes(str)
        );
        console.log("This is the outputted data: " + employerIsNotFiltered);
        return employerIsNotFiltered;
    });
})

所希望的答复是：

[
  {
    name: 'TJ',
    job: 'Software Engineer',
    organization: { company: [Object] },
    location: { city: 'Boston', state: 'Massachusetts' }
  },
  {
    name: 'Dominique',
    job: 'CEO',
    organization: { company: [Object] },
    city: 'Seattle',
    state: 'Washington'
  }
]

任何关于如何让这个方法执行的建议，或者这个方法的替代方案都值得赞赏。

提前感谢

Answer 1

在你的问题上重申我的comment：你只需要换一条线

const people = Array.from(json).flatMap(o => o.People);

至

const people = json.People;

问题中包含的JSON响应是一个对象，Response.json()返回一个承诺，该承诺解析为已经解析的JSON文本响应的表示形式，因此为了访问People属性上的数组，您只需要使用json.People。下面是基于您展示的代码和数据的一个可运行的片段：

​

// The JSON data, copied and pasted from the first code block of your question:
const json = `{"Pagination":{"NumberOfPeople":185,"PageSize":200,"PageNumber":1,"NumberOfPages":1},"People":[{"name":"TJ","job":"Software Engineer","organization":{"company":{"employer":"amazon","department":"IT"}},"location":{"city":"Boston","state":"Massachusetts"}},{"name":"Dominique","job":"CEO","organization":{"company":{"employer":"IBM","department":"IT"}},"city":"Seattle","state":"Washington"},{"name":"Enrique","job":"Engineer","organization":{"company":{"employer":"Bellkrieg Megasystems","department":"Construction"}},"location":{"address":{"state":"New York","city":"New York City","zip":"11323"}}},{"name":"Bob","job":"Project Manager","organization":{"company":{"employer":"Megasystems","department":"R&D"}},"address":{"location":{"quadrant":{"block":1,"state":"Texas","city":"Austin"}}}}]}`;

function mockFetch () {
  return Promise.resolve({
    json: () => Promise.resolve(JSON.parse(json)),
  });
}

const filteredEmployers = ['Megasystems', 'Bellkrieg'];

mockFetch()
  .then(response => response.json())
  .then(json => {
    // Change this line:
    // const people = Array.from(json).flatMap(o => o.People);

    // To:
    const people = json.People;

    return people.filter(person => {
      const employer = person?.organization?.company?.employer;

      if (typeof employer !== 'string') return true;
      const employerIsNotFiltered = filteredEmployers.every(
        str => !employer.includes(str)
      );

      return employerIsNotFiltered;
    });
  })
  .then(console.log);

​