GraphQL 是一种用于 API 的查询语言，它可以让客户端指定需要的数据，并且返回精确的结果。相比于传统的 REST API，GraphQL 更加灵活，可以在一个请求中返回多种类型的数据，并且可以根据客户端的需求进行数据的筛选和排序。本文将会详细介绍 GraphQL 的查询和模式，并且提供一些示例代码，帮助读者更好地理解和应用 GraphQL。
GraphQL 查询
GraphQL 查询是通过一个类似于 JSON 的结构来描述数据的请求。一个基本的查询包括一个或多个字段，每个字段可以包含子字段。查询的字段和子字段可以是标量类型（比如字符串、数字、布尔值等），也可以是对象类型（比如用户、文章等）。下面是一个查询用户信息的例子：
-- -------------------- ---- ------- ----- - -------- ------ - ---- ----- ----- - ----- ------- - - -展开代码
在这个查询中，我们请求了用户的名称、邮件地址以及他们发布的所有文章的标题和内容。查询的语法非常简单，使用了花括号来定义查询的结构，并且使用了圆括号来传递参数。在这个例子中，我们传递了一个 ID 参数来指定要查询的用户。
GraphQL 模式
GraphQL 模式定义了可用的类型和查询，它是一个描述 API 的文档，客户端可以使用它来构建查询。模式包括两个部分：类型和查询。类型定义了数据的结构和关系，查询定义了客户端可以执行的操作。下面是一个简单的模式定义：
-- -------------------- ---- ------- ---- ---- - --- --- ----- ------- ------ ------- ------ -------- - ---- ---- - --- --- ------ ------- -------- ------- ------- ----- - ---- ----- - -------- ----- ---- -------- ----- ---- -展开代码
在这个模式中，我们定义了两个类型：User 和 Post。User 类型包含了用户的 ID、名称、邮件地址和所有发布的文章；Post 类型包含了文章的 ID、标题、内容和作者。我们还定义了两个查询：user 和 post，它们分别接受一个 ID 参数，并且返回对应的用户或文章。在这个模式中，我们使用了感叹号来表示字段是必需的，使用方括号来表示字段是一个列表。
GraphQL 模式的优点
相比于传统的 REST API，GraphQL 模式有以下优点：
- 灵活性：客户端可以根据自己的需求来定义查询，而不需要服务器端提供多个不同的 API。
- 减少网络请求：GraphQL 可以在一个请求中返回多个资源，而不需要多次请求。
- 安全性：GraphQL 模式明确地定义了可用的类型和查询，可以有效地防止恶意查询。
- 可维护性：GraphQL 模式是一个自描述的文档，可以帮助开发者更好地理解和维护 API。
GraphQL 示例代码
下面是一个使用 GraphQL 的示例代码，它使用了 Apollo Client 来构建查询。在这个例子中，我们查询了一个用户的信息，并且将结果渲染到页面上：
-- -------------------- ---- ------- ------ ----- ---- -------- ------ - ---- -------- - ---- ----------------- ----- -------- - ---- ----- ------------ ---- - -------- ---- - ---- ----- ----- - ----- ------- - - - -- -------- ------ -- -- - ----- - -------- ------ ---- - - ------------------ - ---------- - -- - --- -- --------- ------ ------------------ -- ------- ------ -------- ------- ------ - ----- ------------------------- ------------------------ --------------- ---- ------------------------- -- - --- -------------- --------------------- --------------------- ----- --- ----- ------ -- -展开代码
在这个代码中，我们定义了一个名为 GET_USER 的查询，并且使用 useQuery 钩子来执行查询。useQuery 接受两个参数：查询和变量。变量用于传递参数给查询。在这个例子中，我们将用户的 ID 作为变量传递给查询。如果查询正在加载或者出现错误，我们会渲染相应的信息。否则，我们会将查询结果渲染到页面上。
结论
GraphQL 是一个灵活、安全和可维护的 API 查询语言，可以帮助开发者更好地构建和维护 API。本文介绍了 GraphQL 的查询和模式，并且提供了一些示例代码，希望可以帮助读者更好地理解和应用 GraphQL。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6768bca698e3e1ab1a86754f
