在使用 GraphQL 进行 Web 开发时，我们经常会遇到处理 null 值的情况。然而，对于初学者而言，如何在 GraphQL 中处理 null 值可能会非常棘手。这篇文章将介绍 GraphQL 中处理 null 值的最佳实践，并提供一些实用的示例代码。
什么是 null 值？
在 GraphQL 中，null 值指的是一个变量的值不存在。当一个字段的值为空时，GraphQL 会将其解释为空值，也就是 null。需要注意的是，null 值与 undefined 值不同。undefined 值指的是 JavaScript 中的一种特殊类型，而 null 值表示某个字段在数据库中没有值。
null 值在 GraphQL 中的表现
在 GraphQL 中，null 值表示一个可选的字段可以没有值。这就意味着，如果一个字段可以为空，就需要在类型定义中明确表示该字段可以为 null 值。例如，如果我们有一个类型定义如下：
type User {
id: ID!
name: String!
email: String
}在上面的定义中，id 和 name 两个字段被标记为必填项，而 email 字段则没有被标记为必填项。这就意味着 email 字段可以为空。如果我们查询一个用户并且该用户没有 email 值，则 GraphQL 会返回一个如下的响应：
-- -------------------- ---- -------
-
------- -
------- -
----- ----
------- ----- -----
-------- ----
-
-
-可以看到，GraphQL 返回了一个 email 字段的值为 null。这意味着 email 字段确实被查询到了，只不过它的值是空的。
最佳实践
在 GraphQL 中处理 null 值有许多最佳实践，下面是一些值得注意的点。
1. 明确区分 null 值和空值
在 GraphQL 中，null 值表示一个可选的字段可以没有值。这就意味着，如果一个字段可以为空，就需要在类型定义中明确表示该字段可以为 null 值。需要注意的是，如果查询返回了一个空值，该值并不等同于 null 值。在 GraphQL 中，空值是合法的非 null 值，例如：
{
field
}假如查询的 field 字段确实存在，但在数据库中该字段没有值，那么查询会返回一个空值，而不是 null 值。
2. 使用默认值
当字段返回 null 值时，我们可以设置一个默认值来代替 null 值。例如，如果查询结果如下：
-- -------------------- ---- -------
-
------- -
------- -
----- ----
------- ----- -----
-------- ----
-
-
-我们可以在查询中设置一个默认值，如下所示：
query {
User {
id
name
email: email(defaultValue: "No email")
}
}在上面的查询中，当 email 字段返回 null 值时，我们将其设置为默认值 "No email"。这将确保我们总是有一个非空值返回。
3. 使用 fragments 处理 null 值
在 GraphQL 中，我们可以使用 fragments 创造一个可复用的查询。如果我们需要在多个查询中使用该查询，则使用 fragments 将会大大简化代码。但是，当我们使用 fragments 时，需要注意一个问题：如果 fragment 中的字段返回了 null 值，那么整个查询都将返回 null 值。
为了解决这个问题，我们可以在查询中使用 coalesce 函数。coalesce 函数将在接收到 null 值时返回一个默认值。例如，假设我们有如下查询：
-- -------------------- ---- -------
----- -
---- -
--
- -----
- ----------------
-
-
-------- ------------ -- ---- -
-----
-------------
-在上面的查询中，我们使用了 fragments EmailDetails 处理 email 相关的细节。但是，如果用户没有 email 值，则查询将返回 null 值。为了避免这种情况，我们可以使用 coalesce 函数，如下所示：
-- -------------------- ---- -------
----- -
---- -
--
- -----
- ------- ---------------------------- ---
-------------- ------------------------------------ ------
-
-
-------- ------------ -- ---- -
-----
-------------
-在上面的查询中，当 email 和 emailVerified 字段返回 null 值时，我们将它们分别设置为 "" 和 false。这将确保我们总是有一个非空值返回。
示例代码
下面是一些实用的示例代码。
使用默认值
query {
User {
id
name
email(defaultValue: "No email")
}
}使用 fragments 处理 null 值
-- -------------------- ---- -------
----- -
---- -
--
- -----
- ------- ---------------------------- ---
-------------- ------------------------------------ ------
-
-
-------- ------------ -- ---- -
-----
-------------
-总结
在 GraphQL 中处理 null 值是一项非常重要的任务。当我们处理 null 值时，需要明确区分 null 值和空值，并使用默认值和 fragments 处理 null 值。希望这篇文章能够帮助您理解 GraphQL 中的 null 值处理最佳实践，并在实际开发中提供一些指导意义。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64df1897f6b2d6eab3a40ddc