死去的记忆突然刺痛我！ 想起来以前的同事也使用 v-else 嵌套，我在版本迭代，修复了一些 bug 时，就把这段「逻辑」给处理了。当时项目负责人还反对我修改，或者说不相信我的写法。
原先的 if-else 写法
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
if (this.packageInfo.havePackage) {
// havePackage：是否 有买过套餐
if (!this.hasDeposit && this.packageInfo.residueDay > 0) {
type = 1;
} else if (!this.hasDeposit && this.packageInfo.residueDay == 0) {
if (this.packageInfo.residueHours > 0) {
type = 1;
} else {
type = 4;
}
} else {
type = 2;
}
} else {
type = 4;
}
先梳理一下这段代码的业务逻辑：
- 如果有买过套餐
- 如果没有押金，且剩余天数大于 0，则为 1;
- 如果没有押金，且剩余天数等于 0，剩余小时数大于 0，则为 1;
- 如果没有押金，且剩余天数等于 0，剩余小时数不大于 0，则为 4;
- 如果有押金，则为 2;
- 如果没有买过套餐，则为 4;
对于这个逻辑，别说这个嵌套了，就业务逻辑来说，我都有点理不清楚。
新的 return 写法
封装一个函数，对于各种状态进行提前返回。
1
2
3
4
5
6
7
formatType(packageInfo) {
if (!packageInfo.havePackage) return 4;
if (this.hasDeposit) return 2;
if (packageInfo.residueDay > 0) return 1;
if (packageInfo.residueHours > 0) return 1;
return 4;
},
就这样的写法，我觉得更简洁，如果符合，则 return，不符合则一直往下走，直到 return 4。
这已经是涵盖上面的业务逻辑了，当然负责人还是有点「不理解」。因为没有需求文档，他读这段代码读了半天。
