欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Zod進行TypeScript類型驗證使用詳解

 更新時間:2022年09月27日 10:27:10   作者:技術(shù)爬行之旅  
這篇文章主要為大家介紹了Zod進行TypeScript類型驗證使用詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪

引言

這篇文章將描述如何使用Zod 為您的項目設置類型驗證。Zod 是一個用于類型聲明和驗證的開源 TypeScript 庫。我們將研究為什么使用 Zod 進行類型驗證,提供如何使用它的示例,并將其與其他庫進行比較。

什么是類型驗證,為什么需要它?

類型驗證是驗證數(shù)據(jù)結(jié)構(gòu)是否符合特定類型的過程。您可以使用它來確保輸入數(shù)據(jù)的有效性,以及記錄和執(zhí)行代碼的數(shù)據(jù)結(jié)構(gòu)。

使用類型驗證有兩個主要好處:

  • 運行時的數(shù)據(jù)完整性:確保數(shù)據(jù)以正確的格式輸入您的系統(tǒng)有助于避免錯誤并保持數(shù)據(jù)一致性。雖然 TypeScript 可以幫助您在編譯時確保類型安全,但當您處理來自未知數(shù)據(jù)(例如服務器或用戶輸入)的數(shù)據(jù)時,類型驗證在運行時會大放異彩。
  • 文檔:一個好的類型驗證庫將為您使用的數(shù)據(jù)結(jié)構(gòu)提供準確的類型定義。類型定義可用于為您的項目生成靜態(tài)文檔。

為什么要使用zod?

雖然有許多 TypeScript 類型校驗庫,但個人認為 Zod 是比較好的之一。在為您的項目選擇庫時,除了其功能集外,您還應考慮其實現(xiàn)細節(jié)。

  • Zod 具有零依賴性,這意味著您可以在沒有任何其他庫的情況下安裝和使用 Zod,它將幫助您保持更小的包大小。
  • Zod 適用于 Node.js 和所有主流瀏覽器(包括 IE 11)。這使其成為需要支持各種平臺的項目的不錯選擇。
  • Zod 被設計為 TypeScript 優(yōu)先,這意味著該庫將自動為您的數(shù)據(jù)結(jié)構(gòu)推斷靜態(tài) TypeScript 類型。這消除了兩次聲明類型的需要——一次在 Zod 中,一次在 TypeScript 中。它將為您節(jié)省大量輸入,并幫助您保持代碼更改同步。
  • Zod 的 API 簡潔且可鏈接。這使得創(chuàng)建復雜的數(shù)據(jù)類型變得容易。您還可以輕松地將更簡單的類型組合成更復雜的數(shù)據(jù)類型。

使用 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 方法拋出了一個異常。異常將包含一個對象數(shù)組,其中包含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 將簡單地返回其值。

對象

現(xiàn)在讓我們繼續(xù)討論對象。Zod 對驗證嵌套對象結(jié)構(gòu)具有強大的支持。

讓我們創(chuàng)建一個類型來驗證用戶對象。它將包含以下字段:

  • 姓名
  • 電子郵件
  • 電話號碼

要聲明類型,我們使用z.object() 方法:

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

讓我們嘗試根據(jù)我們剛剛創(chuàng)建的類型驗證示例對象:

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

parse方法將返回一個包含解析結(jié)果的對象。由于我們忘記在示例中提供該phoneNumber字段,Zod 將拋出異常,并包含以下錯誤數(shù)組:

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

類型推斷

我們還可以從對象中推斷出類型。這是您可以免費獲取屬性的類型定義并在您的代碼中使用它們的部分:

    type UserType = z.infer<typeof User>;

組合類型

Zod 讓您可以輕松地在彼此之上組合復雜的類型,就像您構(gòu)建樂高積木一樣。

為了證明這一點,讓我們使用User上面的類型對象并構(gòu)建一個更詳細的具有愛好的用戶對象:

    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
    });

通過組合我們的兩個類型對象,我們創(chuàng)建了一個新類型對象,您可以使用它來驗證用戶對象是否具有適當?shù)膼酆米侄巍?/p>

在現(xiàn)有對象之上組合新對象是一種很好的方法,因為它可以幫助您保持數(shù)據(jù)結(jié)構(gòu)中的所有更改同步。

注意事項

在使用 Zod 進行驗證時,需要牢記幾件事。

安全解析

如果不想讓Zod拋出異常,當解析失敗時,可以改用該safeParse方法。這將返回一個包含解析結(jié)果的對象:

 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 實例,這意味著調(diào)用方法的順序很重要。通過切換鏈中調(diào)用的順序,您可以獲得完全不同的結(jié)果:

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

Zod 與其他庫的比較

其他廣泛使用的類型驗證庫也是不錯的選擇,例如 yupio-ts。

以下是您項目的選擇Zod 的一些原因:

  • TypeScript 首次支持。Zod 在構(gòu)建時考慮了 TypeScript,并具有一流的支持。這意味著您可以獲得自動完成和出色的 VsCode 支持。
  • 無需額外工作即可為您獲取類型。
  • 易于組合的類型對象 - 通過組合不同的類型對象來構(gòu)建復雜的驗證規(guī)則。
  • 強大的錯誤處理。Zod 具有出色的錯誤處理功能,具有豐富的 API 用于配置錯誤處理流程。
  • 支持 Promise 和函數(shù)模式。如果您需要驗證函數(shù)或 Promise,Zod 可以滿足您的需求。

結(jié)論

在這篇文章中,我們介紹了如何使用 Zod 庫進行 TypeScript 類型驗證。我們研究了如何創(chuàng)建類型和使用類型來驗證數(shù)據(jù)結(jié)構(gòu)。我們還看到了使用 Zod 時需要注意的一些事項以及它相對于其他庫的優(yōu)勢。

有關(guān) Zod 的更多信息,可以查看其 Github 頁面上的 優(yōu)秀文檔 。

更多關(guān)于Zod TypeScript類型驗證的資料請關(guān)注腳本之家其它相關(guān)文章!

相關(guān)文章

  • smartbanner.js實現(xiàn)可定制智能應用橫幅使用示例

    smartbanner.js實現(xiàn)可定制智能應用橫幅使用示例

    這篇文章主要為大家介紹了smartbanner.js實現(xiàn)可定制智能應用橫幅使用示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
    2023-03-03
  • Fabric.js?監(jiān)聽元素是否相交重疊

    Fabric.js?監(jiān)聽元素是否相交重疊

    這篇文章主要為大家介紹了Fabric.js?監(jiān)聽元素是否相交重疊的方案示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
    2023-02-02
  • JavaScript架構(gòu)localStorage特殊場景下二次封裝操作

    JavaScript架構(gòu)localStorage特殊場景下二次封裝操作

    這篇文章主要為大家介紹了JavaScript架構(gòu)localStorage在特殊場景下的二次封裝操作,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
    2022-06-06
  • 微信小程序 教程之事件

    微信小程序 教程之事件

    這篇文章主要介紹了微信小程序 事件的相關(guān)資料,并附實例代碼,需要的朋友可以參考下
    2016-10-10
  • Css-In-Js實現(xiàn)classNames庫源碼解讀

    Css-In-Js實現(xiàn)classNames庫源碼解讀

    這篇文章主要為大家介紹了Css-In-Js實現(xiàn)classNames庫源碼解讀,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
    2022-12-12
  • autojs寫一個畫板實現(xiàn)AI換頭狗頭蛇

    autojs寫一個畫板實現(xiàn)AI換頭狗頭蛇

    這篇文章主要為大家介紹了autojs寫一個畫板實現(xiàn)AI換頭狗頭蛇過程示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
    2023-01-01
  • 微信小程序 開發(fā)之快遞查詢功能的實現(xiàn)

    微信小程序 開發(fā)之快遞查詢功能的實現(xiàn)

    這篇文章主要介紹了微信小程序 開發(fā)之快遞查詢功能的實現(xiàn)的相關(guān)資料,這里實現(xiàn)微信小程序查詢快遞的功能,需要的朋友可以參考下
    2017-01-01
  • 徒手實現(xiàn)關(guān)于JavaScript的24+數(shù)組方法

    徒手實現(xiàn)關(guān)于JavaScript的24+數(shù)組方法

    數(shù)組是我們?nèi)粘9ぷ髦杏玫淖铑l繁的一類數(shù)據(jù)結(jié)構(gòu),能幫助我們解決許多問題,而其本身也包含接近33個之多的方法,做了一個腦圖分類如下,熟練使用數(shù)組的你,是否想知道他們內(nèi)部的實現(xiàn)原理呢?接下來小編就帶大家進入主題,希望能幫助到你
    2021-09-09
  • 詳解使用koa2完成Excel導入導出

    詳解使用koa2完成Excel導入導出

    這篇文章主要為大家介紹了詳解使用koa2完成Excel導入導出示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
    2023-03-03
  • 微信小程序WXSS樣式文件教程

    微信小程序WXSS樣式文件教程

    這篇文章主要為大家介紹了微信小程序WXSS樣式文件教程,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步早日升職加薪
    2022-04-04

最新評論