如何减少项目里面 if-else (web应用场景)-优快云博客

本文链接：https://blog.youkuaiyun.com/getapi/article/details/146399088

在Web应用开发中，if-else语句是控制流程的重要工具，但过多的if-else不仅会降低代码的可读性，还可能导致维护困难和逻辑错误。因此，在项目中减少if-else的数量是一个常见的优化目标。以下是一些有效的策略和技术来实现这一点：

1. 使用多态（Polymorphism）

如果if-else语句用于处理不同类型的对象行为，可以使用面向对象编程中的多态特性。

示例：

假设我们有一个支付系统，支持多种支付方式（如微信、支付宝、信用卡）。如果直接用if-else实现，可能会写成这样：

function processPayment(paymentType, amount) {
    if (paymentType === 'wechat') {
        return `Processing WeChat payment of ${amount}`;
    } else if (paymentType === 'alipay') {
        return `Processing Alipay payment of ${amount}`;
    } else if (paymentType === 'creditCard') {
        return `Processing Credit Card payment of ${amount}`;
    } else {
        throw new Error('Unsupported payment type');
    }
}

优化方法：
通过创建不同的支付类并利用多态：

class PaymentProcessor {
    process(amount) {
        throw new Error('This method should be overridden');
    }
}

class WeChatPayment extends PaymentProcessor {
    process(amount) {
        return `Processing WeChat payment of ${amount}`;
    }
}

class AlipayPayment extends PaymentProcessor {
    process(amount) {
        return `Processing Alipay payment of ${amount}`;
    }
}

class CreditCardPayment extends PaymentProcessor {
    process(amount) {
        return `Processing Credit Card payment of ${amount}`;
    }
}

// 工厂函数简化实例化
function getPaymentProcessor(paymentType) {
    const processors = {
        wechat: new WeChatPayment(),
        alipay: new AlipayPayment(),
        creditCard: new CreditCardPayment()
    };
    if (!processors[paymentType]) {
        throw new Error('Unsupported payment type');
    }
    return processors[paymentType];
}

// 使用
const processor = getPaymentProcessor('wechat');
console.log(processor.process(100));

这样，代码更加清晰且易于扩展。

2. 使用策略模式（Strategy Pattern）

策略模式是一种行为设计模式，允许你定义一系列算法，并将它们封装在独立的类中，使得它们可以互换使用。

示例：

同样的支付问题可以用策略模式解决：

const paymentStrategies = {
    wechat: (amount) => `Processing WeChat payment of ${amount}`,
    alipay: (amount) => `Processing Alipay payment of ${amount}`,
    creditCard: (amount) => `Processing Credit Card payment of ${amount}`
};

function processPayment(paymentType, amount) {
    if (!paymentStrategies[paymentType]) {
        throw new Error('Unsupported payment type');
    }
    return paymentStrategies[paymentType](amount);
}

// 使用
console.log(processPayment('wechat', 100));

这种方式减少了条件分支，同时保持了灵活性。

3. 使用状态模式（State Pattern）

当逻辑依赖于对象的状态时，可以使用状态模式来替代复杂的if-else。

示例：

假设一个订单状态流转逻辑：

function handleOrder(orderStatus) {
    if (orderStatus === 'pending') {
        return 'Order is pending';
    } else if (orderStatus === 'processing') {
        return 'Order is being processed';
    } else if (orderStatus === 'shipped') {
        return 'Order has been shipped';
    } else {
        throw new Error('Invalid order status');
    }
}

优化方法：
使用状态模式：

class Order {
    constructor() {
        this.state = new PendingState();
    }

    setState(state) {
        this.state = state;
    }

    process() {
        return this.state.handle();
    }
}

class PendingState {
    handle() {
        return 'Order is pending';
    }
}

class ProcessingState {
    handle() {
        return 'Order is being processed';
    }
}

class ShippedState {
    handle() {
        return 'Order has been shipped';
    }
}

// 使用
const order = new Order();
console.log(order.process()); // Order is pending

order.setState(new ProcessingState());
console.log(order.process()); // Order is being processed

这种方式让状态流转更加直观。

4. 使用表驱动法（Table-Driven Method）

对于简单的条件判断，可以通过映射表（如对象或数组）来替代if-else。

示例：

假设根据用户角色返回不同的权限列表：

function getUserPermissions(role) {
    if (role === 'admin') {
        return ['read', 'write', 'delete'];
    } else if (role === 'editor') {
        return ['read', 'write'];
    } else if (role === 'viewer') {
        return ['read'];
    } else {
        throw new Error('Unknown role');
    }
}

优化方法：
使用映射表：

const rolePermissions = {
    admin: ['read', 'write', 'delete'],
    editor: ['read', 'write'],
    viewer: ['read']
};

function getUserPermissions(role) {
    if (!rolePermissions[role]) {
        throw new Error('Unknown role');
    }
    return rolePermissions[role];
}

这种方法简洁明了，尤其适用于配置型逻辑。

5. 使用函数式编程（Functional Programming）

函数式编程提倡使用高阶函数和纯函数来减少显式的条件分支。

示例：

假设需要根据条件执行不同的操作：

function executeAction(condition, data) {
    if (condition === 'caseA') {
        return `Case A: ${data}`;
    } else if (condition === 'caseB') {
        return `Case B: ${data}`;
    } else {
        return `Default case: ${data}`;
    }
}

优化方法：
使用函数映射：

const actions = {
    caseA: (data) => `Case A: ${data}`,
    caseB: (data) => `Case B: ${data}`,
    default: (data) => `Default case: ${data}`
};

function executeAction(condition, data) {
    return (actions[condition] || actions.default)(data);
}

6. 异常处理代替条件检查

对于一些边界条件，可以通过异常处理机制代替if-else。

示例：

function divide(a, b) {
    if (b === 0) {
        throw new Error('Division by zero');
    }
    return a / b;
}

优化方法：
直接抛出异常，调用者捕获：

function divide(a, b) {
    if (b === 0) {
        throw new Error('Division by zero');
    }
    return a / b;
}

try {
    console.log(divide(10, 0));
} catch (error) {
    console.error(error.message);
}