JavaScript 的 if else 和 switch对比 ,如何优化

if else 和 switch一般开发中都是基于判断条件的数量来决定的，数量越多大家就越倾向于 switch 而不是 if else，switch 的实现采取了branch table 索引的 ，而且 switch 语句比较时使用的是全等操作符，不会发生类型转换的损耗。

如何优化if：最大概率出现到最小概率出现依次排列；减少判断的次数，使用嵌套语句。

在项目中，优化条件语句的最好办法还是避免使用 if-else 和 switch 语句，而是通过数组或者对象来查询，也就是查找表（lookup Tables）。

以下是将要优化的代码片段：

        getTextColor(item){
            switch (item.couponType) {
                // 运费绿
                case 'SHIPPING_FREE':
                    return '#00836D';
                    break;
                // 直降红
                case 'DEDUCTION':
                    return '#FE0000';
                    break;
                // 满减 折扣 橘
                case 'DEDUCTION_ON':
                case 'DISCOUNT':
                    return '#FB6C0E';
                    break;
                default:
                    break;
            }
        }

可以优化成查找表的方式：

        getTextColor(item){
            return {
                'SHIPPING_FREE': '#00836D',// 运费绿
                'DEDUCTION': '#FE0000',// 直降红
                'DEDUCTION_ON': '#FB6C0E',// 满减 折扣 橘
                'DISCOUNT': '#FB6C0E',
            }[item.couponType]
        },

为了映射表可以多次使用，可以使用闭包：

            const textColor = (() => {
                const table = {
                    "SHIPPING_FREE": "#00836D",
                    "DEDUCTION": "#FE0000",
                    "DEDUCTION_ON": "#FB6C0E"
                };
                return key => table[key]??'default';
            })();

            console.log(statusText("SHIPPING_FREE"));

此处的??为空合并运算符

            const foo = null ?? 'default string';
            console.log(foo);
            // expected output: "default string"

            const baz = 0 ?? 42;
            console.log(baz);
            // expected output: 0