JavaScript设想形式----战略形式

声明:这个系列为浏览《JavaScript设想形式与开辟实践》 —-曾探@著一书的读书笔记

1.战略形式的定义

将稳定的部份和变化的部份离隔是每一个设想形式的主题。

定义一系列的算法,把它们一个个封装起来,而且使它们能够互相替换。

2.战略形式的目的

将算法的运用与算法的完成星散开来。

3.传统言语中的战略形式和JavaScript中的战略形式对照

3.1.传统言语中的战略形式

运用战略形式来完成盘算奖金


var performances = function () {};

performances.prototype.calculate = function (salary) {
    return salary * 4;
};

var performanceA =function () {};

performanceA.prototype.calculate=function (salary) {
    return salary * 3;
};

var performanceB =function () {};

performanceB.prototype.calculate=function (salary) {
    return salary * 2;
};

//定义奖金类Bonus

var Bonus =function () {
    this.salary = null;  //原始工资
    this.strategy = null;//绩效品级对应的战略对象
};

Bonus.prototype.setSalary=function (salary) {
    this.salary=salary;  //设置员工的原始工资
};

Bonus.prototype.setStrategy=function (strategy) {
    this.strategy=strategy;//设置绩效品级对应的战略对象
};


Bonus.prototype.getBonus =function () { //获得奖金数额
    return this.strategy.calculate(this.salary);//把盘算奖金的操纵托付给对应的战略对象
};




var bonus = new Bonus();
bonus.setSalary(10000);
bonus.setStrategy(new performances());//设置战略对象

console.log(bonus.getBonus());

bonus.setStrategy(new performanceA());

console.log(bonus.getBonus());

定义有系列的算法,把它们各自封装成战略类,算法被封装在战略类内部的要领里。在客户端对Context提议要求的时刻,Context老是把要求托付给这些战略对象中心的某一个举行盘算。

3.2.JavaScript中的战略形式


//封装的战略算法
var strategies={
    "S":function (salary) {
        return salary * 4;
    },
    "A":function (salary) {
        return salary * 3;
    },
    "B":function (salary) {
        return salary * 2;
    }
};


//详细的盘算要领
var calculateBonus=function (level, salary) {
    return strategies[level](salary);
};

console.log(calculateBonus('S',1000));
console.log(calculateBonus('A',4000));

运用战略形式重构代码,能够消弭顺序中大片的前提分支语句。在现实开辟中,我们一般会把算法的寄义散布开来,使战略形式也能够用来封装一系列的“营业划定规矩”。只需这些营业划定规矩指向的目的一致,而且能够被替换运用,我们就能够运用战略形式来封装他们。

4.战略形式完成的表单校验

4.1运用JavaScript来完成的一个支撑多重校验划定规矩表单校验

//战略对象

var strategies = {
    isNonEmpty: function (value, errorMsg){
        if (value === '') {
            return errorMsg;
        }
    },
    minLength: function (value, length, errorMg){
        if (value.length < length) {
            return errorMg;
        }
    },
    isMobile: function (value, errorMsg){
        if (!/(^1[3|5|8][0-9]{9}$)/.test(value)) {
            return errorMsg;
        }
    }
};



/**
 * Validator 类
 * @constructor
 */
var Validator = function (){
    this.cache = [];
};

Validator.prototype.add = function (dom, rules){
    var self = this;

    for (var i = 0, rule; rule = rules[i++];) {
        (function (rule){
            var strategyAry=rule.strategy.split(':');
            var errorMsg=rule.errorMsg;

            self.cache.push(function (){
                var strategy=strategyAry.shift();
                strategyAry.unshift(dom.value);
                strategyAry.push(errorMsg);
                return strategies[strategy].apply(dom,strategyAry);
            })
        })(rule)
    }
};

Validator.prototype.start=function (){
    for (var i=0,validatorFunc;validatorFunc=this.cache[i++];){
        var errorMsg=validatorFunc();
        if(errorMsg){
            return errorMsg;
        }
    }
};

//客户端挪用的代码

var registerForm=document.getElementById('registerForm');
var validataFunc=function (){
    var validator=new Validator();

    validator.add(registerForm.userName,[{
        'strategy':'isNonEnpty',
        'errorMsg':'用户名不能为空'
    },{
        'strategy':'minLength',
        'errorMsg':'用户名长度不能小于10位'
    }]);

    // validator.add(registerForm.password,[])

    var errorMsg =validator.start();
    return errorMsg;

};

registerForm.onsubmit=function (){
    var errorMsg=validataFunc();

    if(errorMsg){
        alert(errorMsg);
        return false;
    }
};

4.2战略形式的优瑕玷:

长处:

  • 战略形式应用组合,托付和多态等手艺头脑,能够有用的防止多重前提挑选语句;

  • 战略形式供应了对开放-关闭准绳的圆满支撑,将算法封装在自力的strategy中,使得它们易于切换,易于明白,易于扩大。

  • 战略形式中的算法也能够复用在体系的别的处所,从而防止很多反复的复制粘贴事情。

  • 在战略形式中应用组合和托付来让Context具有实行算法的才,这也是继续的一种更轻巧的替换计划。

瑕玷:

  • 战略形式会在顺序中增加很多的战略类和战略对象

  • 要运用战略形式,就必须要相识各个strategy和他们之间的差别点,如许才挑选一个适宜的strategy

4.3函数多态性的形貌

在函数作为一等对象的言语中,战略形式是隐形的。strategy就是值为函数的变量。

在JavaScript中,除了运用类来封装算法和行动以外,运用函数固然也是一种挑选。这些“算法”能够被封装到函数中而且四周通报,也就是我们常说的“高阶函数”。

现实上在JavaScript这类将函数作为一等对象的言语里,战略形式已融入到了言语自身当中,我们常常运用高阶函数来封装差别的行动,而且把它通报到另一个函数中。当我们对这些函数发出“挪用”的音讯时,差别的函数会返回差别的实行效果。所以在JavaScript中,“函数对象的多态性”会越发简朴些。

总结:

在JavaScript言语的战略形式中,战略类每每被函数所替代,这时候战略形式就成了一种“隐形”的形式。

《JavaScript设想形式----战略形式》

    原文作者:zhiqiang21
    原文地址: https://segmentfault.com/a/1190000006059459
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞