摘要

在开发中，我们经常要写 if…else 来判断条件。但是过多的 if…else 会让代码变得冗长难懂不好维护，有什么好方法呢？让我们来听个故事！

正文

故事开始

小白是一名 CocosCreator 程序员，任务是在游戏开发组组长的带领下开发一款游戏。一天，组长发来了一个任务，让小白来处理他传过来的角度值，判断区域。

小白心喜：哈哈，我刚看完的 TypeScript 枚举写法正好用上了！小白整理了一下思路：
“我应该先定义一个区域枚举，组长说是四个区域”

enum Area {
    A = 0,
    B,
    C,
    D
}

“然后写一个方法来判断传入的角度”

public getArea (degree: number): Area {
    if (degree >= 0 && degree < 90) {
        return Area.A;
    } else if (degree >= 90 && degree < 180) {
        return Area.B;
    } else if (degree >= 180 && degree < 270) {
        return Area.C;
    } else {
        return Area.D;
    }
}

“最后接收返回值打印就好了”

public onLoad (): void {
    // 组长传来角度让你判断区域
    let degree: number = 150;
    // 以下为你负责部分
    let area: Area = this.getArea(degree);
    if (area === Area.A) {
        console.log("A 区");
    } else if (area === Area.B) {
        console.log("B 区");
    } else if (area === Area.C) {
        console.log("C 区");
    } else {
        console.log("D 区");
    }
}

回炉重造

高兴的小白连着测试了几个角度值都正确，他就愉快的提交到 Git 然后去吃午饭。但是没让他想到的是，下午刚回到公司组长就找他谈话：小白，你这代码不行！回去重写，不许出现 if…else！

“什么？你不让我用if…else了！！！”终究小白只是心中吼了一下，没敢喊出来。他灰溜溜的回去看自己的代码，却也没个头绪。

这时，他的同事小黑看到了愁眉苦脸的小白问怎么了。待了解了事情的原委后，小黑哈哈一笑：我要是组长我也说你，你这样写代码，如果碰到了 16 个区域判断你要写 16 个 if…else 吗？你难道忘了你学过的数组结构了吗？

小白猛的一拍大腿，对啊！！！

“打印区域用数组改写”

public onLoad (): void {
    // 组长传来角度让你判断区域
    let degree: number = 150;
    // 以下为你负责部分
    let area: Area = this.getArea(degree);
    let areaList: string[] = ["A 区", "B 区", "C 区", "D 区"];
    console.log(areaList[area]);
}

“角度判断改写”

public getArea (degree: number): Area {
    /** 每个区域占据角度 */
    const EveryAreaDegree: number = 90;
    let index: number = Math.floor(degree / EveryAreaDegree);
    let degreeArray: Area[] = [Area.A, Area.B, Area.C, Area.D];
    return degreeArray[index];
}

字符串枚举

这回小白总算是过关了。小白事后请小黑吃了顿大餐！

在工作之余，小白自己还测试了下字符串枚举。

enum Area {
    A = "a",
    B = "b",
    C = "c",
    D = "d"
}

同理，不过是换成对象

public onLoad (): void {
    // 组长传来角度让你判断区域
    let degree: number = 150;
    // 以下为你负责部分
    let area: Area = this.getArea(degree);
    let areaList: object = {
        "a": "A 区",
        "b": "B 区",
        "c": "C 区",
        "d": "D 区"
    };
    console.log(areaList[area]);
}

故事到这里就结束了，小伙伴们有没有有所感悟呢？
O(∩_∩)O~~

结语

if 虽好，可不要贪杯哦！

O(∩_∩)O~~

微信公众号