解决if...else..的大量嵌套

2023-06-11 17:32| 来源: 网络整理| 查看: 265

大量的if...else,会造成代码的可阅读性变差，高维护成本，例如需要再家一个判断，需要小心翼翼的找到地方，再if...else中间进行加入

函数式编程+设计模式替代if...else（❗注意！不是说所有的if…else都要被替代）

工厂模式1

假设我们现在有一个需求，即根据用户的类型和他们的购买量来计算折扣。18岁以下的购买10以上台可打8折优惠，18-30岁购买20以上台可享受7折优惠

const discount = { //这里对象的子项都是箭头函数，接收加个给出判断 child: (quantity) => (quantity > 10 ? 0.8 : 1), youth: (quantity) => (quantity > 20 ? 0.7 : 1), default: () => 1, } const createCalculator = (age, quantity) => { //这里是用到了逻辑中断，再未传入年龄字段的时候使用default return (discount[age] || discount['default'])(quantity) } console.log(createCalculator('child', 18)) console.log(createCalculator('child', 7)) console.log(createCalculator('youth', 17))

使用这样的方法下来的话代码可读性就会提高很多，而且后期需要其它判断条件直接再函数内添加便可以了

工厂模式2

这个和上面那个属于同一个，再次加了一层封装，是写法更加简洁

const strategies = { child: (quantity) => (quantity > 10 ? 0.8 : 1), youth: (quantity) => (quantity > 20 ? 0.7 : 1), default: () => 1, } //这边先接收那个年龄段的 const createCalculator = (age) => { //再返回一个对象，内含有方法函数，来根据多少台判断出是否打折，打折多少 return { calculate: (quantity) => (strategies[age] || strategies['default'])(quantity), } } const child = createCalculator('child') console.log(child.calculate(18))

查找表模式

这个模式和上面两个说白还是一样的，只不过是更简单明了，容易理解

//用常量把方法都定义在了外面 const studentStrategy = (quantity) => (quantity > 10 ? 0.8 : 1) const seniorStrategy = (quantity) => (quantity > 20 ? 0.7 : 1) const defaultStrategy = () => 1 //这边添入对象里 const strategies = { child: studentStrategy, youth: seniorStrategy, default: defaultStrategy, } //这边函数调用就可以 const calculate = (age, quantity) => { return (strategies[age] || strategies['default'])(quantity) } console.log(calculate('child', 15)) // 输出: 0.8

希望本文能够帮助你解决优化大量的 if...else 语句的问题

【本文地址】

公司简介

联系我们