返回顶部
首页 > 资讯 > 前端开发 > JavaScript >Zod进行TypeScript类型验证使用详解
  • 701
分享到

Zod进行TypeScript类型验证使用详解

2024-04-02 19:04:59 701人浏览 安东尼
摘要

目录引言什么是类型验证,为什么需要它?为什么要使用zod?使用 Zod 进行类型验证的示例Primitives对象类型推断组合类型注意事项安全解析无法识别的Key被删除其他事项Zod

引言

这篇文章将描述如何使用Zod 为您的项目设置类型验证。Zod 是一个用于类型声明和验证的开源 typescript 库。我们将研究为什么使用 Zod 进行类型验证,提供如何使用它的示例,并将其与其他库进行比较。

什么是类型验证,为什么需要它?

类型验证是验证数据结构是否符合特定类型的过程。您可以使用它来确保输入数据的有效性,以及记录和执行代码的数据结构。

使用类型验证有两个主要好处:

  • 运行时的数据完整性:确保数据以正确的格式输入您的系统有助于避免错误并保持数据一致性。虽然 TypeScript 可以帮助您在编译时确保类型安全,但当您处理来自未知数据(例如服务器或用户输入)的数据时,类型验证在运行时会大放异彩。
  • 文档:一个好的类型验证库将为您使用的数据结构提供准确的类型定义。类型定义可用于为您的项目生成静态文档。

为什么要使用zod?

虽然有许多 TypeScript 类型校验库,但个人认为 Zod 是比较好的之一。在为您的项目选择库时,除了其功能集外,您还应考虑其实现细节。

  • Zod 具有零依赖性,这意味着您可以在没有任何其他库的情况下安装和使用 Zod,它将帮助您保持更小的包大小。
  • Zod 适用于 node.js 和所有主流浏览器(包括 IE 11)。这使其成为需要支持各种平台的项目的不错选择。
  • Zod 被设计为 TypeScript 优先,这意味着该库将自动为您的数据结构推断静态 TypeScript 类型。这消除了两次声明类型的需要——一次在 Zod 中,一次在 TypeScript 中。它将为您节省大量输入,并帮助您保持代码更改同步。
  • Zod 的 api 简洁且可链接。这使得创建复杂的数据类型变得容易。您还可以轻松地将更简单的类型组合成更复杂的数据类型。

使用 Zod 进行类型验证的示例

Primitives

让我们看看如何验证字符串。假设我们要验证用户输入的密码。我们希望密码是一个非空字符串,长度至少为 8 个字符,最多为 32 个字符:

import { z } from "zod";
const stringSchema = z.string().nonempty().min(8).max(32);
stringSchema.parse("");
stringSchema.parse(""); // throws an exception
stringSchema.parse("I am a valid passWord"); // returns "I am a valid password"

当你运行上面的代码时,你会看到 parse 方法抛出了一个异常。异常将包含一个对象数组,其中包含ZodError错误的详细描述:

    [
      {
      "code": "too_small",
      "minimum": 1,
      "type": "string",
      "inclusive": true,
      "message": "Should be at least 1 characters",
      "path": []
      },
      {
      "code": "too_small",
      "minimum": 8,
      "type": "string",
      "inclusive": true,
      "message": "Should be at least 8 characters",
      "path": []
      }
    ]

当您尝试解析有效字符串时,parse 将简单地返回其值。

对象

现在让我们继续讨论对象。Zod 对验证嵌套对象结构具有强大的支持。

让我们创建一个类型来验证用户对象。它将包含以下字段:

  • 姓名
  • 电子邮件
  • 电话号码

要声明类型,我们使用z.object() 方法:

    import { z } from "zod";
    const User = z.object({
      email: z.string().email(),
      name: z.string(),
      phoneNumber: z.number()
    });

让我们尝试根据我们刚刚创建的类型验证示例对象:

    const result = User.parse({
      email: "hi@sample.com",
      name: "Hello World"
    });

parse方法将返回一个包含解析结果的对象。由于我们忘记在示例中提供该phoneNumber字段,Zod 将抛出异常,并包含以下错误数组:

    [
      {
      "code": "invalid_type",
      "expected": "number",
      "received": "undefined",
      "inclusive": true,
      "message": "Required"
      "path": ["phoneNumber"]
      }
    ]

类型推断

我们还可以从对象中推断出类型。这是您可以免费获取属性的类型定义并在您的代码中使用它们的部分:

    type UserType = z.infer<typeof User>;

组合类型

Zod 让您可以轻松地在彼此之上组合复杂的类型,就像您构建乐高积木一样。

为了证明这一点,让我们使用User上面的类型对象并构建一个更详细的具有爱好的用户对象:

    const User = z.object({
      email: z.string().email(),
      name: z.string(),
      phoneNumber: z.number()
    });
    const Hobby = z.object({
      hobbyName: z.string().min(1)
    });
    const Hobbyist = User.merge(Hobby);
    const result = Hobbyist.safeParse({
      email: "hi@sample.com",
      name: "Hello World",
      phoneNumber: 123
    });

通过组合我们的两个类型对象,我们创建了一个新类型对象,您可以使用它来验证用户对象是否具有适当的爱好字段。

在现有对象之上组合新对象是一种很好的方法,因为它可以帮助您保持数据结构中的所有更改同步。

注意事项

在使用 Zod 进行验证时,需要牢记几件事。

安全解析

如果不想让Zod抛出异常,当解析失败时,可以改用该safeParse方法。这将返回一个包含解析结果的对象:

 mySchema.safeParse(""I am a valid password""); // => { success: true; data: "I am a valid password" }    
 mySchema.safeParse(""); // => { success: false; error: ZodError } 

无法识别的Key被删除

默认情况下,Zod 在解析过程中会去除无法识别的key。这意味着任何未知的key都将被忽略。

如果您想通过无法识别的key而不丢失它们,您可以使用该.passthrough()方法。

其他事项

.array() 方法返回一个新的 ZodArray 实例,这意味着调用方法的顺序很重要。通过切换链中调用的顺序,您可以获得完全不同的结果:

z.string().optional().array(); // (string | undefined)[]  
z.string().array().optional(); // string[] | undefined

Zod 与其他库的比较

其他广泛使用的类型验证库也是不错的选择,例如 yupio-ts

以下是您项目的选择Zod 的一些原因:

  • TypeScript 首次支持。Zod 在构建时考虑了 TypeScript,并具有一流的支持。这意味着您可以获得自动完成和出色的 vscode 支持。
  • 无需额外工作即可为您获取类型。
  • 易于组合的类型对象 - 通过组合不同的类型对象来构建复杂的验证规则。
  • 强大的错误处理。Zod 具有出色的错误处理功能,具有丰富的 API 用于配置错误处理流程。
  • 支持 Promise 和函数模式。如果您需要验证函数或 Promise,Zod 可以满足您的需求。

结论

在这篇文章中,我们介绍了如何使用 Zod 库进行 TypeScript 类型验证。我们研究了如何创建类型和使用类型来验证数据结构。我们还看到了使用 Zod 时需要注意的一些事项以及它相对于其他库的优势。

有关 Zod 的更多信息,可以查看其 GitHub 页面上的 优秀文档 。

更多关于Zod TypeScript类型验证的资料请关注编程网其它相关文章!

--结束END--

本文标题: Zod进行TypeScript类型验证使用详解

本文链接: https://lsjlt.com/news/168506.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • Zod进行TypeScript类型验证使用详解
    目录引言什么是类型验证,为什么需要它?为什么要使用zod?使用 Zod 进行类型验证的示例Primitives对象类型推断组合类型注意事项安全解析无法识别的Key被删除其他事项Zod...
    99+
    2024-04-02
  • 详解使用Spring Security进行自动登录验证
    在之前的博客使用SpringMVC创建Web工程并使用SpringSecurity进行权限控制的详细配置方法 中,我们描述了如何配置一个基于SpringMVC、SpringSecurity框架的网站系统。在这篇博客中,我们将继续描述如何使用...
    99+
    2023-05-31
    spring security 登录
  • 使用TypeScript类型注解的方法详解
    目录类型注解类型推导TS和JS共有的数据类型TS独有的数据类型anyunknownvoidnevertuple函数参数和返回值类型断言非空类型断言字面量类型缩小总结类型注解 Type...
    99+
    2024-04-02
  • 详解TypeScript使用及类型声明文件
    目录简介Script 与 Vue3defineProps 与 TypescriptdefineEmits 与 Typescriptref 与 Typescriptcomputed 与...
    99+
    2024-04-02
  • TypeScript的条件类型使用示例详解
    目录TypeScript 的条件类型使用方式条件类型和 keyof 组合在条件返回中使用 T在类型输出中使用 T 时的联合类型使用条件类型推断类型总结TypeScript 的条件类型...
    99+
    2024-04-02
  • TypeScript的类型指令单行注释详解
    目录正文@ts-ignore 和 @ts-expect-error@ts-check 和 @ts-nocheck正文 单行注释应该在项目里用的很少吧, 我没见过在项目中使用过, 但是...
    99+
    2024-04-02
  • 如何使用TypeScript类型注解
    小编给大家分享一下如何使用TypeScript类型注解,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!类型注解TypeScript提供了很多数据类型,通过类型对变量进行限制,称之为类型注解,使用类型注解后,就不能够随意变更变...
    99+
    2023-06-29
  • 如何使用 PHP 进行用户验证?
    用户验证在 php 中至关重要,可以通过多种方式实现,包括依靠会话、使用数据库或利用第三方库。借助会话方法,可以通过检查 $_session 变量是否存在来验证用户是否已登录。使用数据库...
    99+
    2024-04-19
    php 用户验证 mysql laravel 敏感数据
  • 使用Nest.js怎么进行授权验证
    这篇文章主要介绍了使用Nest.js怎么进行授权验证,此处通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考价值,需要的朋友可以参考下:0x0 前言系统授权指的是登录用户执行操作过程,比如管理员可以对系统进行用户操作、网站帖...
    99+
    2023-06-06
  • Javascript使用integrity属性进行安全验证
    目录一、script标签引入文件 1. 引入本地文件2. 引入远程文件二、integrity安全验证 1. 引入vue的cdn资源2. 验证是否正常一、script标签引入文件 在...
    99+
    2024-04-02
  • typeScript中数组类型定义及应用详解
    目录1.定义数组1.1 「类型 + 方括号」表示法1.2 数组泛型1.3 用接口表示数组1.4 类数组2. any 在数组中的应用 ...
    99+
    2023-05-19
    ts数据类型 ts 定义数组 ts定义数组对象
  • TypeScript实用技巧 Nominal Typing名义类型详解
    目录Nominal Typing(名义类型)概念解析拓展应用在Vue中的应用Nominal Typing(名义类型) 概念解析 意思是给一个类型附加上一个“名义&rdqu...
    99+
    2024-04-02
  • TypeScript中泛型的使用详细讲解
    目录一、泛型程序设计是一种编程风格或编程范式二、案例:传入的参数类型与返回的类型一样三、形式类型参数四、泛型约束五、泛型函数六、泛型函数类型推断补充:应用场景总结一、泛型程序设计是一...
    99+
    2022-11-13
    typescript泛型使用 ts 泛型
  • 深入了解TypeScript中常用类型的使用
    目录原始类型:string,number,boolean数组(Arrays)Any类型在变量上使用类型注释函数(Functions)返回类型注释(Return Type Annota...
    99+
    2024-04-02
  • 使用TypeScript实现一个类型安全的EventBus示例详解
    目录前言准备工作目标思路具体实现全部代码后记前言 随着vue3的发布,TypeScript在国内越来越流行,学习TypeScript也随即变成了大势所趋。本文就通过实现一个类型安全的...
    99+
    2024-04-02
  • C#使用Data Annotations进行手动数据验证
    Data Annotations是在Asp.Net中用于表单验证的,它通过Attribute直接标记字段的有效性,简单且直观。在非Asp.Net程序中(如控制台程序),我们也可以使用...
    99+
    2024-04-02
  • 如何使用 PHP 函数进行数据验证?
    php 提供了数据验证函数来检查变量类型 (e.g. is_int()、is_string()),并提供了过滤器函数来转换和验证数据 (e.g. filter_var()、filter_...
    99+
    2024-05-03
    数据验证 php函数
  • golang 如何使用类型断言进行类型转换
    go 中类型断言用于将接口值转换为更具体的类型。它包含以下步骤:声明接口值和目标类型。使用类型断言语法将接口值转换为目标类型,并将结果赋值给变量。使用布尔变量检查转换是否成功。如果转换失...
    99+
    2024-05-01
    类型转换 类型断言 golang
  • PHP接入Apple对access_token/identityToken进行JWT验证流程详解
    目录解析 JWT 头获取 Apple 公钥解析$keys(公钥)获取目标 Key解码获取 OpenID多说两句需用到 Composer 库:firebase/php-jwt,直接安装...
    99+
    2024-04-02
  • React中如何使用async validator进行表单验证
    这篇文章主要为大家展示了“React中如何使用async validator进行表单验证”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“React中如何使用asy...
    99+
    2024-04-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作