建立通用的表单校验逻辑库

表单校验一直是web开发中最基础，也是最很差作的一个环节。相信不少初学web开发的人，第一课就是学习若是基于js、jQuery实现表单验证工做，在10年前，甚至是5年前，JavaScript仍是被多数工程师轻视的一门语言，那时候不少人认为JavaScript的出现充其量也就为了完成web页面上的表单校验的工做。由此可知表单校验的确是web开发中至关基础的一项工做。说它很差作，是由于一些项目中表单校验每每工做量极大，一个字段要校验的项目很是多，例如非空、字符串长度限制等等，正常来讲任何一个字段都须要进行校验，好比数据库每一个字段的长度是有限的，因此最起码要校验一下字段的长度吧。因此，表单校验就是一项没太大技术含量，可是又很是耗费体力的工做，尤为在一些对交互友好性、用户体验要求较高的项目中，表单校验的开发就变得更繁琐与枯燥。

因而咱们每每依赖于一些现成的表单校验框架，如：jquery-validation、validation-engine、easyui-validatebox等。

分析以上js库，能够发现他们有个共同的特色，就是采用策略模式，将不一样的表单校验规则封装成策略类，提升校验逻辑的复用性；同时提供“规则字符串”的形式，让用户经过一个简单的字符串来建立规则策略类的实例，来对表单的输入项进行校验，校验的结果就是一个标志位加一个错误提示语句。这样的设计使得表单校验由一个体力活变成了一个配置项，大大下降了表单校验相关的代码量。

可是的以上控件都是按照这个逻辑实现的表单校验，可是他们立足点倒是在表单的提示，与web页面结合过于紧密，其逻辑部分没法单独使用。而他们大多都是基于jQuery，如今不少web项目都再也不依赖于jQuery；同时他们的提示方式也未必是咱们想要的，对于现在的web项目而言，作将错误提示封装成组件是一件很容易的事情，真正须要的反而是表单校验的逻辑部分。

因此基于以上控件的表单验证特色，笔者开发了一个表单校验库，更准确说是表单校验逻辑库——my-validation，这个库仅提供表单校验的逻辑，使用简单的api可将复杂的表单验证过程变得只须要配置一下就能完成，便于校验的逻辑复用，并返回带有提示语句的错误结果列表，方便嵌入到任何框架中，完成表单校验的逻辑部分。

---

安装方法:

webpack中使用:

npm install git://github.com/laden666666/my-validation --save

而后直接用reqiure引用便可

var myValidation = require("my-validation");

若是是浏览器环境直接script标签引用my-validation.js或者my-validation.min.js文件便可。 

---

使用方法:

1.根据规则字符串校验：

共提供两个两个重载api：

myValidation.validation(ruleStringString, valueString)

参数	参数描述
ruleStringString	规则的字符串
valueString	要校验的字符串

MyValidation.validation(ruleStringJson, values, isStringPath) 

参数	参数描述
ruleStringJson	规则的字符串的集合
values	要校验的字符串的集合
isStringPath	启用子对象key的路径的作key的模式，校验路径对应子对象的属性

这里解释一下规则的字符串，它是校验的核心，格式是

规则1名[参数1,参数2…];规则2名[参数1,参数2…]…

如：“required;minSize[5]”表示使用required规则校验，校验非空；而后再使用minSize规则校验，参数是5，表示字符串长度不能小于5 
规则的字符串中特殊字符有“;”、“,”两个，须要转义，转义字符分别为“;;”、“;,”。

使用的时候能够直接校验一个字符串，如:

var result = myValidation.validation("required;sizeMax[16]", "test"); 

也能够根据一json，完成对一个对象的校验，而且支持微信小程序那种使用过子对象key的路径的key的功能，如：

var result = myValidation.validation({ "user.name" : "required;sizeMax[16]", },{ user : { name : "test" } },true) 

myValidation.validation返回的结果是校验规则结果的数组。 

 

2.注册自定义规则：

校验规则至关于一个策略模式的实现，若是不能自定义规则，这个校验系统就至关于断了翅膀的鸟，没有任何自由度可言。因此可以提供动态扩展规则的api是很是重要的，扩展的api以下：

myValidation.registerRule(name, validationFn, msg)

参数	参数描述
name	规则的名称
validationFn	校验函数
msg	默认的错误提示语句,支持字符串或函数

校验结果有两个：boolean型校验结果和一个字符串型的错误提示语

这个错误提示语句能够动态生成，也能够指定为通用的形式，如:

myValidation.registerRule("minSize", function (value, object, count) { return !!value && value.length >= parseInt(count); },function (value, object, count) { return "最少输入" + count + "个字符数"; });

指定默认错误提示的例子：

myValidation.registerRule("integer", function (value, object) { return !!value && /^[-+]?\d+$/.test(value); }, "必须是整数");

boolean型校验结果的生成就要用到校验函数validationFn。校验函数是表单校验的核心，经过上面的两个例子咱们可以校验函数的定义方式，他的具体参数以下： 

参数	参数描述
value	要校验的值
object	校验的对象，包括校验字符串，和用户其余自定义属性
params	校验字符串的参数列表，是rest参数。如xx[a,b,c]，这里会解析出3个参数，分别为：“a”、“b”、“c”

须要注意的是，校验失败的状况下必须返回fals或者是调用myValidation.result生成的返回结果，不然视为校验成功。

 

3.自定义返回错误提示：

有时候须要在验证的时候动态的生成返回错误，而不是返回默认错误，此时可使用如下api：

myValidation.result (result, msg)

 

参数	参数描述
result	boolean型，校验的结果，仅当false时候表示验证失败
msg	验证失败的字符串，提示这个字符串的优先级比默认字符串高

如：

myValidation.registerRule("returnMsg", function () { return myValidation.result(false, "自定义错误提示"); }, "此为默认提示，会被覆盖掉");

上面规则的错误返回提示语会是校验时候生成的“自定义错误提示”这句话，而不是注册时候设置的默认的提示语。

 

4.分析验证结果:

验证结果是个错误信息的数组,或者是一个key、value形式的json,可是表单验证的结果到底是成功仍是失败,咱们没法立刻得知。你能够经过遍历各个验证项的result字段,不断一个个相与来得到结果的boolean值,也能够直接使用咱们的api函数：

myValidation.analyseResult (result)

参数	参数描述
result	validation的验证结果

如：

var result = myValidation.validation({
    "user.name" : "required;sizeMax[16]",
},{
     user : {
          name : "test"
     }
},true);

result = myValidation.analyseResult(result) //result被转为boolean型

---

默认校验库:

参数	参数描述	例子
required	必填	required
minSize	要求字符串长度不大于指定值	minSize[5]
maxSize	要求字符串长度不小于指定值	maxSize[5]
min	必须是数字，并要求不小于指定值	min[5]
max	必须是数字，并要求不大于指定值	max[5]
number	必须是数字	number
integer	必须是整数	integer
regex	正则表单式	regex[^\\S{2,4}$,i]

目前仅提供几个笔者立刻要使用的规则，其余规则你们能够本身经过myValidation.registerRule注册。