Zod進(jìn)行TypeScript類型驗(yàn)證使用詳解
引言
這篇文章將描述如何使用Zod 為您的項(xiàng)目設(shè)置類型驗(yàn)證。Zod 是一個(gè)用于類型聲明和驗(yàn)證的開源 TypeScript 庫。我們將研究為什么使用 Zod 進(jìn)行類型驗(yàn)證,提供如何使用它的示例,并將其與其他庫進(jìn)行比較。
什么是類型驗(yàn)證,為什么需要它?
類型驗(yàn)證是驗(yàn)證數(shù)據(jù)結(jié)構(gòu)是否符合特定類型的過程。您可以使用它來確保輸入數(shù)據(jù)的有效性,以及記錄和執(zhí)行代碼的數(shù)據(jù)結(jié)構(gòu)。
使用類型驗(yàn)證有兩個(gè)主要好處:
- 運(yùn)行時(shí)的數(shù)據(jù)完整性:確保數(shù)據(jù)以正確的格式輸入您的系統(tǒng)有助于避免錯(cuò)誤并保持?jǐn)?shù)據(jù)一致性。雖然 TypeScript 可以幫助您在編譯時(shí)確保類型安全,但當(dāng)您處理來自未知數(shù)據(jù)(例如服務(wù)器或用戶輸入)的數(shù)據(jù)時(shí),類型驗(yàn)證在運(yùn)行時(shí)會(huì)大放異彩。
- 文檔:一個(gè)好的類型驗(yàn)證庫將為您使用的數(shù)據(jù)結(jié)構(gòu)提供準(zhǔn)確的類型定義。類型定義可用于為您的項(xiàng)目生成靜態(tài)文檔。
為什么要使用zod?
雖然有許多 TypeScript 類型校驗(yàn)庫,但個(gè)人認(rèn)為 Zod 是比較好的之一。在為您的項(xiàng)目選擇庫時(shí),除了其功能集外,您還應(yīng)考慮其實(shí)現(xiàn)細(xì)節(jié)。
- Zod 具有零依賴性,這意味著您可以在沒有任何其他庫的情況下安裝和使用 Zod,它將幫助您保持更小的包大小。
- Zod 適用于 Node.js 和所有主流瀏覽器(包括 IE 11)。這使其成為需要支持各種平臺的項(xiàng)目的不錯(cuò)選擇。
- Zod 被設(shè)計(jì)為 TypeScript 優(yōu)先,這意味著該庫將自動(dòng)為您的數(shù)據(jù)結(jié)構(gòu)推斷靜態(tài) TypeScript 類型。這消除了兩次聲明類型的需要——一次在 Zod 中,一次在 TypeScript 中。它將為您節(jié)省大量輸入,并幫助您保持代碼更改同步。
- Zod 的 API 簡潔且可鏈接。這使得創(chuàng)建復(fù)雜的數(shù)據(jù)類型變得容易。您還可以輕松地將更簡單的類型組合成更復(fù)雜的數(shù)據(jù)類型。
使用 Zod 進(jìn)行類型驗(yàn)證的示例
Primitives
讓我們看看如何驗(yàn)證字符串。假設(shè)我們要驗(yàn)證用戶輸入的密碼。我們希望密碼是一個(gè)非空字符串,長度至少為 8 個(gè)字符,最多為 32 個(gè)字符:
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"
當(dāng)你運(yùn)行上面的代碼時(shí),你會(huì)看到 parse 方法拋出了一個(gè)異常。異常將包含一個(gè)對象數(shù)組,其中包含ZodError錯(cuò)誤的詳細(xì)描述:
[
{
"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": []
}
]
當(dāng)您嘗試解析有效字符串時(shí),parse 將簡單地返回其值。
對象
現(xiàn)在讓我們繼續(xù)討論對象。Zod 對驗(yàn)證嵌套對象結(jié)構(gòu)具有強(qiáng)大的支持。
讓我們創(chuàng)建一個(gè)類型來驗(yàn)證用戶對象。它將包含以下字段:
- 姓名
- 電子郵件
- 電話號碼
要聲明類型,我們使用z.object() 方法:
import { z } from "zod";
const User = z.object({
email: z.string().email(),
name: z.string(),
phoneNumber: z.number()
});
讓我們嘗試根據(jù)我們剛剛創(chuàng)建的類型驗(yàn)證示例對象:
const result = User.parse({
email: "hi@sample.com",
name: "Hello World"
});
該parse方法將返回一個(gè)包含解析結(jié)果的對象。由于我們忘記在示例中提供該phoneNumber字段,Zod 將拋出異常,并包含以下錯(cuò)誤數(shù)組:
[
{
"code": "invalid_type",
"expected": "number",
"received": "undefined",
"inclusive": true,
"message": "Required"
"path": ["phoneNumber"]
}
]
類型推斷
我們還可以從對象中推斷出類型。這是您可以免費(fèi)獲取屬性的類型定義并在您的代碼中使用它們的部分:
type UserType = z.infer<typeof User>;
組合類型
Zod 讓您可以輕松地在彼此之上組合復(fù)雜的類型,就像您構(gòu)建樂高積木一樣。
為了證明這一點(diǎn),讓我們使用User上面的類型對象并構(gòu)建一個(gè)更詳細(xì)的具有愛好的用戶對象:
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
});
通過組合我們的兩個(gè)類型對象,我們創(chuàng)建了一個(gè)新類型對象,您可以使用它來驗(yàn)證用戶對象是否具有適當(dāng)?shù)膼酆米侄巍?/p>
在現(xiàn)有對象之上組合新對象是一種很好的方法,因?yàn)樗梢詭椭3謹(jǐn)?shù)據(jù)結(jié)構(gòu)中的所有更改同步。
注意事項(xiàng)
在使用 Zod 進(jìn)行驗(yàn)證時(shí),需要牢記幾件事。
安全解析
如果不想讓Zod拋出異常,當(dāng)解析失敗時(shí),可以改用該safeParse方法。這將返回一個(gè)包含解析結(jié)果的對象:
mySchema.safeParse(""I am a valid password""); // => { success: true; data: "I am a valid password" }
mySchema.safeParse(""); // => { success: false; error: ZodError }
無法識別的Key被刪除
默認(rèn)情況下,Zod 在解析過程中會(huì)去除無法識別的key。這意味著任何未知的key都將被忽略。
如果您想通過無法識別的key而不丟失它們,您可以使用該.passthrough()方法。
其他事項(xiàng)
.array() 方法返回一個(gè)新的 ZodArray 實(shí)例,這意味著調(diào)用方法的順序很重要。通過切換鏈中調(diào)用的順序,您可以獲得完全不同的結(jié)果:
z.string().optional().array(); // (string | undefined)[] z.string().array().optional(); // string[] | undefined
Zod 與其他庫的比較
其他廣泛使用的類型驗(yàn)證庫也是不錯(cuò)的選擇,例如 yup 和 io-ts。
以下是您項(xiàng)目的選擇Zod 的一些原因:
- TypeScript 首次支持。Zod 在構(gòu)建時(shí)考慮了 TypeScript,并具有一流的支持。這意味著您可以獲得自動(dòng)完成和出色的 VsCode 支持。
- 無需額外工作即可為您獲取類型。
- 易于組合的類型對象 - 通過組合不同的類型對象來構(gòu)建復(fù)雜的驗(yàn)證規(guī)則。
- 強(qiáng)大的錯(cuò)誤處理。Zod 具有出色的錯(cuò)誤處理功能,具有豐富的 API 用于配置錯(cuò)誤處理流程。
- 支持 Promise 和函數(shù)模式。如果您需要驗(yàn)證函數(shù)或 Promise,Zod 可以滿足您的需求。
結(jié)論
在這篇文章中,我們介紹了如何使用 Zod 庫進(jìn)行 TypeScript 類型驗(yàn)證。我們研究了如何創(chuàng)建類型和使用類型來驗(yàn)證數(shù)據(jù)結(jié)構(gòu)。我們還看到了使用 Zod 時(shí)需要注意的一些事項(xiàng)以及它相對于其他庫的優(yōu)勢。
有關(guān) Zod 的更多信息,可以查看其 Github 頁面上的 優(yōu)秀文檔 。
更多關(guān)于Zod TypeScript類型驗(yàn)證的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
微信小程序 按鈕滑動(dòng)的實(shí)現(xiàn)方法
這篇文章主要介紹了微信小程序 按鈕滑動(dòng)的實(shí)現(xiàn)方法的相關(guān)資料,希望通過本文能幫助到大家實(shí)現(xiàn)這樣的功能,需要的朋友可以參考下2017-09-09
JavaScript數(shù)組 幾個(gè)常用方法總結(jié)
這篇文章主要介紹了JavaScript數(shù)組 幾個(gè)常用方法,主要概述的方法有filter()、map()、sort()、reduce()、forEach(),這些方法都是JavaScript常用到的方法,下面文章內(nèi)容詳細(xì)介紹了他們的語法、參數(shù)、返回值等資料,需要的朋友可以參考一下2021-11-11
TypeScript?學(xué)習(xí)筆記之?typeScript類定義,類的繼承,類成員修飾符
這篇文章主要介紹了TypeScript?學(xué)習(xí)筆記之?typeScript類定義,類的繼承,類成員修飾符,typeScript?支持面向?qū)ο蟮乃刑匦裕热珙?、接口?下文詳細(xì)內(nèi)容,需要的小伙伴可以參考一下2022-02-02
requestAnimationFrame定時(shí)動(dòng)畫屏幕刷新率節(jié)流示例淺析
這篇文章主要為大家介紹了requestAnimationFrame定時(shí)動(dòng)畫屏幕刷新率節(jié)流示例淺析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-02-02
JS實(shí)現(xiàn)可恢復(fù)的文件上傳示例詳解
這篇文章主要為大家介紹了JS實(shí)現(xiàn)可恢復(fù)的文件上傳示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-12-12

