javascript设计模式--策略模式之输入验证_javascript技巧

根据依赖倒置原则，高层次的模块不应该依赖于低层次的模块，因此不能让验证的调用方直接使用。
通过验证器的方式进行封装和抽象。
步骤2：
定义验证器，可以将所有验证策略导入其内，也可以单独添加验证策略函数。 



步骤3：
添加验证方法，接受外部调用。
第一个参数rule，设置成验证规则，比如 "minLength:6"，通过下面的代码会生成对具体策略函数的调用，调用会压到缓存中，等待一起调用。
":6"表示策略函数根据自身规则所定制的参数。 



通过一个check函数来调用所有的验证。并将错误的结果进行返回。 



步骤4：
在需要验证的地方，先new一个验证器对象。 





将包含验证策略函数的对象导入，或者单独添加验证策略函数。 



可以看出，不同的验证策略我们可以预先封装进策略对象中，也可以根据实际情况即时添加。
然后通过添加验证方法将需要验证的策略，被验证的dom元素，错误消息，被验证的值添加进验证器中，这样避免了直接调用策略对象，降低了耦合性。



调用验证器的check执行所有的验证。 



check返回的是错误对象，我们可以在check后通过该对象统一地对DOM元素进行提示性操作，比如设置焦点，选中内容，或者为输入框外部包上一层红色的样式。
至此，可以看出通过策略模式的改在，输入验证时，我们只需要关心用哪个验证规则，采用什么样的提示性信息即可，不再暴露实现细节，方便调用，方便后续的扩展和组件化。
全部代码：

    

    

    

        
javascript设计模式--策略模式之输入验证_javascript技巧
        
javascript设计模式--策略模式之输入验证_javascript技巧:策略模式定义了算法家族，分别封装起来，让他们之间可以互相替换，此模式让算法的变化独立于使用算饭的客户. 先定义一个简单的输入表单：        .form{ width: px; height: px; #margin: px auto; } .form-item-label{ width:p
        
推荐度：

    
    

        
            点击下载本文
            文档为doc格式
        
    

              
        
                

            标签：
                        验证
                        输入验证
                        策略模式
                    
                
            
            
 
                    

                        
热门焦点