Zod + TypeScript：轻松实现模式验证

Learn how to use Zod, a TypeScript schema validation library that allows you to validate external data at runtime.

学习如何使用 Zod，这是一个 TypeScript 模式验证库，允许您在运行时验证外部数据。

TypeScript has rapidly become one of the most popular languages for web development. As a superset of JavaScript that adds optional static typing and other features, TypeScript offers benefits for development teams looking to write more robust and maintainable code.

TypeScript 已迅速成为 web 开发中最流行的语言之一。作为 JavaScript 的超集，添加了可选的静态类型和其他特性，TypeScript 为希望编写更健壮和可维护代码的开发团队提供了好处。

There’s one area where TypeScript alone falls short: runtime validation. When data comes from external sources (API responses, form submissions or user inputs), TypeScript can’t guarantee that the data matches our expected types at runtime. This is where a library like Zod comes in.

有一个领域是 TypeScript 单独无法满足的：运行时验证。当数据来自外部来源（API 响应、表单提交或用户输入）时，TypeScript 无法保证数据在运行时与我们预期的类型匹配。这就是像 Zod 这样的库的用武之地。

Zod is a TypeScript-first schema validation library that bridges the gap between compile-time type safety and runtime validation. It allows us to define schemas that not only validate data at runtime but also automatically infer TypeScript types, giving us the best of both worlds. In this article, we’ll explore how Zod makes schema validation effortless, and how it integrates beautifully with TypeScript and React applications.

Zod 是一个以 TypeScript 为主的模式验证库，它弥合了编译时类型安全和运行时验证之间的差距。它允许我们定义模式，不仅在运行时验证数据，还自动推断 TypeScript 类型，让我们享受两者的最佳体验。在本文中，我们将探讨 Zod 如何使模式验证变得轻而易举，以及它如何与 TypeScript 和 React 应用程序完美集成。

What Is Zod and Why Do We Need It?

Zod 是什么，为什么我们需要它？

Before diving into Zod, let’s understand the problem it solves. Consider a typical scenario where we’re fetching user data from an API:

在深入了解 Zod 之前，让我们理解它解决的问题。考虑一个典型场景，我们正在从 API 获取用户数据：

interface User { name: string; email: string; age: number;
} async function fetchUser(id: string): Promise<User> { const response = await fetch(`/api/users/${id}`); const data = await response.json(); return data as User;
}

The type assertion as User tells TypeScript to trust...