这段代码有没有更优雅的写法?

2018-12-27 15:06:23 +08:00
 waiaan
if (state1) {
  if (someObj.a.events1) {
    handleEvents1(someObj.a.events1);
  }
  if (someObj.a.events2) {
    handleEvents2(someObj.a.events2);
  }
} else if (!state1) {
  if (someObj.b.events1) {
    handleEvents1(someObj.b.events1);
  }
  if (someObj.b.events2) {
    handleEvents2(someObj.b.events2);
  }
}

请说一下思路,谢谢!

1595 次点击
所在节点    问与答
12 条回复
hcymk2
2018-12-27 15:14:42 +08:00
Optional Chaining
coderluan
2018-12-27 15:18:08 +08:00
函数数组喽,不光优雅,性能也好,类似 handleEvents[state](events[state])
ytxbnahn
2018-12-27 15:50:52 +08:00
var temp = state1 ? someObj.a : someObj.b;
temp.events1 && handleEvents1(temp.events1);
temp.events2 && handleEvents1(temp.events2);
waiaan
2018-12-27 16:04:55 +08:00
@ytxbnahn 多谢。
kzfile
2018-12-27 16:08:34 +08:00
很迷的 else if
waiaan
2018-12-27 16:14:12 +08:00
@ytxbnahn 能否说一下思路?
FInt1620
2018-12-27 16:17:41 +08:00
@ytxbnahn
@waiaan
if 后的表达式可视为布尔值。如果只触发了 events1 而没有触发 events2 或者只触发了 events2 而没有触发 events1,你准备怎么做?
FInt1620
2018-12-27 16:41:02 +08:00
先用自然语言捋一捋这段代码的基本思路,再视情况能否精简。
如果 state1 为 true,那么执行
if (someObj.a.events1) {
...
}
if (someObj.a.events2) {
...
}
否则,如果 state1 为 false,那么执行
if (someObj.b.events1) {
...
}
if (someObj.b.events2) {
...
}
由于布尔值只有 true 或 false,所以最外侧 if 语句的表达式判断语句可以改成
if (state1) {
...
} else {
...
}
var obj = state1 ? someObj.a : someObj.b;
而 a 和 b 都是 someObj 对象的属性。
但是,无法确定 a 和 b 各自的属性是否具有相同的含义。也就是说,a.events1 属性和 b.events1 属性的性质不同,那么它们不能被精简。
类似于 Java 中的两个不同类。即使它们的实例都可以是父类的属性,但即使它们有相同名称的属性或方法,也不可将它们混淆。
所以,内部 if 语句不能被精简。最保险且最能体现原有代码含义的结果为:
var obj;
if (state1) {
obj = someObj.a;
if (obj.events1)
obj.handleEvents(obj.events1);
}
var obj = state ? someObj.a : someObj.b;
if (obj.event1)
obj.handleEvents(obj.events1)
FInt1620
2018-12-27 16:43:15 +08:00
以上代码未完成。以下是精简后的全部内容:
var obj;
if (state1) {
obj = someObj.a;
if (obj.events1)
obj.handleEvents(obj.events1);
if (obj.events2)
obj.handleEvents(obj.events2);
} else {
obj = someObj.b;
if (obj.events1)
obj.handleEvents(obj.events1);
if (obj.events2)
obj.handleEvents(obj.events2);
}
whileFalse
2018-12-27 16:49:19 +08:00
with(state1 ? someObj.a : someObj.b){
if(event1) handleEvent1(event1)
if(event2) handleEvent1(event2)
}
FInt1620
2018-12-27 16:54:41 +08:00
如果在实际开发中,a 属性中的 events1 属性名称和 b 属性 events1 的名称完全一致,并且 a 属性中的 events2 属性名称和 b 属性 events2 的名称也完全一致,可以再进行精简:
var obj = state1 ? someObj.a : someObj.b;
if (obj.events1)
obj.handleEvents(obj.events1);
if (obj.events2)
obj.handleEvents(obj.events2);
但是,对于在同一页面同时使用的 a 属性和 b 属性而言,具有相同的属性名称并不是一件好事,不建议这么做
waiaan
2018-12-27 17:23:34 +08:00
@FInt1620 非常感谢,我仔细消化一下。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/521531

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX