Ajv format校驗(yàn)使用示例分析
初始化項(xiàng)目demo
npm init -y
安裝 Ajv 版本 7
npm install ajv
安裝ajv-formats插件
// ESM/TypeScript import
import Ajv from "ajv"
import addFormats from "ajv-formats"
// Node.js require:
const Ajv = require("ajv")
const addFormats = require("ajv-formats")
const ajv = new Ajv()
addFormats(ajv)
運(yùn)行分解
新建index.js文件
- 導(dǎo)入ajv和對(duì)應(yīng)的format插件庫(kù)
- 定義對(duì)應(yīng)的schema結(jié)構(gòu)
- 調(diào)用ajv.compile()方法,對(duì)schema進(jìn)行編譯,返回一個(gè)待執(zhí)行的校驗(yàn)函數(shù)
- 執(zhí)行回調(diào)函數(shù),并將我們需要判斷的data,當(dāng)做參數(shù)傳遞
- 判斷返回的結(jié)果
const Ajv = require("ajv")
const addFormats = require("ajv-formats")
const ajv = new Ajv()
addFormats(ajv)
const schema = {
type: "string",
format: 'email',
minLength: 1,
maxLength: 255,
pattern: '/^[a-zA-Z]/'
};
const validate = ajv.compile(schema)
const data = 'string'
const valid = validate(data)
console.log(valid)
if (!valid) console.log(validate.errors)
打開(kāi)控制臺(tái),運(yùn)行node index.js。
分析
在這里我們就可以利用vscode自帶的調(diào)試功能,進(jìn)行代碼分析了。首先,我在19行打了斷點(diǎn),這樣我們就可以觀察到函數(shù)的參數(shù)和調(diào)用情況了。不會(huì)調(diào)試的同學(xué)可以看看這篇文章 新手向:前端程序員必學(xué)基本技能——調(diào)試JS代碼 調(diào)試之后,就可以看到編譯之后的回調(diào)函數(shù)了。如下代碼
(function anonymous(self, scope) {
const schema11 = scope.schema[6];
const formats0 = scope.formats[0];
const func2 = scope.func[1];
const pattern0 = scope.pattern[0];
return function validate10(data, {instancePath = "", parentData, parentDataProperty, rootData = data} = {}) {
let vErrors = null;
let errors = 0;
if (errors === 0) {
if (errors === 0) {
if (typeof data === "string") {
if (func2(data) > 255) {
validate10.errors = [{
instancePath,
schemaPath: "#/maxLength",
keyword: "maxLength",
params: {
limit: 255
},
message: "must NOT have more than 255 characters"
}];
return false;
} else {
if (func2(data) < 1) {
validate10.errors = [{
instancePath,
schemaPath: "#/minLength",
keyword: "minLength",
params: {
limit: 1
},
message: "must NOT have fewer than 1 characters"
}];
return false;
} else {
if (!pattern0.test(data)) {
validate10.errors = [{
instancePath,
schemaPath: "#/pattern",
keyword: "pattern",
params: {
pattern: "/^[a-zA-Z]/"
},
message: "must match pattern "" + "/^[a-zA-Z]/" + """
}];
return false;
} else {
if (!formats0.test(data)) {
validate10.errors = [{
instancePath,
schemaPath: "#/format",
keyword: "format",
params: {
format: "email"
},
message: "must match format "" + "email" + """
}];
return false;
}
}
}
}
} else {
validate10.errors = [{
instancePath,
schemaPath: "#/type",
keyword: "type",
params: {
type: "string"
},
message: "must be string"
}];
return false;
}
}
}
validate10.errors = vErrors;
return errors === 0;
};
});
通過(guò)以上文件我們可以看到,ajv對(duì)我們定義好的shcma進(jìn)行編譯,編譯之后生成了一個(gè)回調(diào)函數(shù)。在回調(diào)函數(shù)中對(duì),定義好的規(guī)則進(jìn)行判斷處理。
首先是對(duì)type類型的判斷處理,然后是字符串類型的最大長(zhǎng)度、最小長(zhǎng)度和正則的校驗(yàn),最后是對(duì)format的規(guī)則校驗(yàn)。
如果,其中的一項(xiàng)不滿足規(guī)則時(shí),直接會(huì)走到errors里邊,把錯(cuò)誤信息進(jìn)行處理輸出。
總結(jié)
了解Ajv的的判斷邏輯,先進(jìn)行schema的定義,然后compile進(jìn)行schema的編譯、生成回調(diào)函數(shù),最后輸入data數(shù)據(jù)進(jìn)行校驗(yàn)。
在我們定義好schema之后,在string類型中,他會(huì)按照先type、字符串最大長(zhǎng)度、最小長(zhǎng)度、正則判斷和format的順序進(jìn)行,data的校驗(yàn)。
以上就是Ajv format校驗(yàn)使用示例分析的詳細(xì)內(nèi)容,更多關(guān)于Ajv format校驗(yàn)的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
由document.body和document.documentElement想到的
不知道大家對(duì)這個(gè)標(biāo)題有沒(méi)有想法,反正此前我一直把他們混為了一談。其實(shí)不然,首先需有個(gè)“標(biāo)準(zhǔn)”的概念。2009-04-04
webapi根據(jù)id獲取元素的實(shí)現(xiàn)思路
掌握document.getElementById() 根據(jù)id獲取元素,在頁(yè)面畫出一個(gè)寬200 高200 粉色的盒子, 在控制臺(tái)打印這個(gè)盒子,接到這樣的需求如何處理呢,下面小編給大家分享webapi根據(jù)id獲取元素的實(shí)現(xiàn)思路,感興趣的朋友一起看看吧2024-02-02
原生JavaScript實(shí)現(xiàn)日歷功能代碼實(shí)例(無(wú)引用Jq)
這篇文章主要介紹了原生JavaScript實(shí)現(xiàn)日歷功能代碼實(shí)例(無(wú)引用Jq),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-09-09
代碼精簡(jiǎn)的可以實(shí)現(xiàn)元素圓角的js函數(shù)
代碼精簡(jiǎn)的可以實(shí)現(xiàn)元素圓角的js函數(shù)...2007-07-07
真正好用的js驗(yàn)證上傳文件大小的簡(jiǎn)單方法
下面小編就為大家?guī)?lái)一篇真正好用的js驗(yàn)證上傳文件大小的簡(jiǎn)單方法。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-10-10
微信小程序?qū)崿F(xiàn)移動(dòng)端滑動(dòng)分頁(yè)效果(ajax)
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)移動(dòng)端滑動(dòng)分頁(yè)效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-06-06
JavaScript之a(chǎn)ppendChild、insertBefore和insertAfter使用說(shuō)明
這幾天需要用到對(duì)HTML節(jié)點(diǎn)元素的刪/插操作,由于用到insertBefore方法的時(shí)候遇到了一些麻煩,現(xiàn)在作為知識(shí)的整理,分別對(duì)appendChild、insertBefore和insertAfter做個(gè)總結(jié)2010-12-12

