前端实战篇 不一样的策略模式，帮你告别N个if

阅读时长：2分钟

双十一临近，养猫盖楼、组队PK、手势地图，各种烧脑的操作，还是不如直接打折来得划算。

下面看看“无套路打折”，如何玩出新花样

示例一 不套路的折扣

let priceDiscount = {
    large(price) {
        return 0.9 * price
    },
    medium(price) {
        return 0.7 * price
    },
    small(price) {
        return 0.5 * price
    }
}

let deal = function (discount, price) {
    return discount(price)
}

let payFact = deal(priceDiscount.large, 1000)

示例二 告别N个if的表单验证

我相信，到了2020年，依然还会有不少项目充斥着if。

代码过于庞大，改动的风险也会成指数式爆发。

为了早点下班，是时候改变了。

//属于硬编码的值封装起来，便于维护
let errorMsg = {
    default: '输入数据格式不正确',
    minLength: '输入数据长度不足',
    isNumber: '请输入数字',
    required: '内容不为空',
    isMobile: '请输入正确手机号码'
}

//设置调试bug开关

let Logging = {
    debug: true,
    alert(msg) {
        if (this.debug)
            alert(msg)
    },
    log(msg) {
        if (this.debug)
            console.log(msg)
    },
    info(msg) {
        if (this.debug)
            console.info(msg)
    },
    error(msg) {
        if (this.debug)
            console.error(msg)
    }
}


let rules = {
    minLength(value, length, msg) {
        if (value.length < length)
            Logging.alert(msg || errorMsg.minLength)
    },
    required(value, msg) {
        if (!value)
            Logging.alert(msg || errorMsg.required)
    },
    isMobile(value, msg) {
        if (!/(^1[3|5|8][0-9]{9}$)/.test(value)) {
            Logging.alert(msg || errorMsg.isMobile)
        }
    }
}

function Validator() {
    this.items = []
}
Validator.prototype = {
    Constructor: Validator,
    add(value, rule, msg) {
        let args = [value]
        let ruleArray = rule.split(':')
        if (ruleArray.length > 1) {
            args.push(ruleArray[1])
            rule = ruleArray[0]
        }
        args.push(msg)
        this.items.push(function () {
            return rules[rule].apply(this, args)
        })

    },
    start() {
        for (let func of this.items) {
            let result = func()
            if (result) {
                Logging.log(result)
            }
        }
    },
}

let validator = new Validator()
validator.add('', 'required', '')
validator.add('dasda', 'isMobile', '')
validator.add('dssa', 'minLength:5', '')
validator.start();

上一篇 前端实战篇 6行代码-单例模式

下一篇 场景丰富的代理模式

技术文章只看不练=白看，只练不思考、总结=白学

如果您觉得有用，赞起来吧

您的认可，是我写作强劲的动力

欢迎大家留言评论，给予宝贵意见:)