GraphQL 是一种由 Facebook 创造的查询语言，为数据查询和 API 构建提供了更加具体的解决方案。它可以帮助前端开发人员有效地从不同的数据源中拉取数据，包括嵌套式 JSON 数据。本文将介绍如何通过 GraphQL 查询嵌套式 JSON 数据，包括学习和指导意义，并提供示例代码。
什么是嵌套式 JSON 数据
嵌套式 JSON 数据是指包含非常多嵌套层级的 JSON 格式数据，通常在前端开发中难以处理。例如，下面是一段嵌套式 JSON 数据：
-- -------------------- ---- -------
-
--------- -
------- -------
------ ---
---------- -
---------- ------
------- ---- -----
--
----------- -
-
------- -------
--------------- --------
--
-
------- ------
--------------- --------
-
-
-
-我们可以看到上面的 JSON 数据包含多个嵌套层级，例如地址（address）和联系人（contacts），这使得在前端开发中进行数据查询和处理变得非常困难。
使用 GraphQL 可以有效地解决这个问题。GraphQL 提供了一种定义数据结构的方式，开发者可以使用它来查询任何类型的数据，包括嵌套式 JSON 数据。
以下是如何通过 GraphQL 查询上述 JSON 中的信息：
-- -------------------- ---- -------
----- -
------ -
----
---
------- -
-------
----
-
-------- -
----
------------
-
-
-通过上述查询，我们可以轻松地获取 JSON 中任何所需信息。例如，如果我们只需要获取联系人列表，可以使用以下查询：
query {
person {
contacts {
name
relationship
}
}
}以上是 GraphQL 查询语法简介， 接下来将详细讲解 GraphQL 嵌套 JSON 数据的查询语法。
定义数据模式
GraphQL 中通过 schema（模式）定义数据结构、类型和关系。在我们查询嵌套 JSON 数据之前，需要先定义数据结构。
-- -------------------- ---- ------- ---- ------ - ----- ------- ---- ---- -------- -------- --------- ---------- - ---- ------- - -------- ------- ----- ------- - ---- ------- - ----- ------- ------------- ------- - ---- ----- - ------- ------- -
上述示例模式定义了三个类型：Person、Address 和 Contact。Person 类型包含 name、age、address 和 contacts 四个字段。其中 address 是一个嵌套类型，Contact 则是一个列表类型。
查询数据
在已经定义好模式后，我们可以通过以下 GraphQL 查询语法来查询嵌套 JSON 数据：
-- -------------------- ---- -------
----- -
------ -
----
---
------- -
-------
----
-
-------- -
----
------------
-
-
-上述查询将返回一个包含所有在数据结构中定义的字段的 JSON 对象。
但我们需要注意，如果我们只想查询 contacts 中的信息，就不必查询所有字段，可以通过以下语法仅仅获取指定的字段：
query {
person {
contacts {
name
relationship
}
}
}上述代码将只查询 contacts 字段，而不查询 person 字段中的其他信息。
使用变量进行查询
GraphQL 可以使用变量来动态查询数据。下面是如何使用变量查询 contacts 中的关系为“Family”的联系人信息：
query GetContacts($relationship: String!) {
person {
contacts(relationship: $relationship) {
name
relationship
}
}
}上述查询中，我们使用变量 $relationship 来表示查询条件。在实际使用中，我们可以通过代码动态传递变量来获取数据。
示例代码
下面是一段基于 Node.js 的示例代码，用于查询嵌套式 JSON 数据：
-- -------------------- ---- -------
----- ------- - -------------------
----- - ----------- - - ---------------------------
----- - ----------- - - -------------------
-- --- ---- --
----- ---- - -
------- -
----- -------
---- ---
-------- -
-------- ------
----- ---- -----
--
--------- -
-
----- -------
------------- --------
--
-
----- ------
------------- --------
-
-
-
--
-- -- ------- --
----- ------ - -------------
---- ------ -
----- -------
---- ----
-------- --------
--------- ----------
-
---- ------- -
-------- -------
----- -------
-
---- ------- -
----- -------
------------- -------
-
---- ----- -
------- -------
-
---
-- ------
----- ---- - -
------- -- -- -----------
--
-- -----
----- --- - ----------
------------------- -------------
------- -------
---------- -----
--------- ----
----
-- -----
---------------- -- -- ---------------- ------ -- --------------------------总结
本文介绍了如何通过 GraphQL 查询嵌套式 JSON 数据，包括定义模式、查询数据和使用变量。与传统的 RESTful API 相比，GraphQL 具有更好的灵活性、可扩展性和性能表现，因此在前端开发中有着越来越广泛的应用。希望本文能够帮助读者更好地理解和使用 GraphQL。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6455cccf968c7c53b092e383
