Javascript - 使用 map 重构if 语句，意大利面条式代码

如何解决Javascript - 使用 map 重构if 语句，意大利面条式代码

我有以下代码：

for (const element of elements) {
  try {
    // eslint-disable-next-line no-await-in-loop
    const { a,b,c,d,e } = await func(element.id);

    if (tokens.includes(a)) {
      saveElement("a",a,element.id); // First arg is the key as string
      break;
    }

    if (tokens.includes(b)) {
      saveElement("b",element.id);
      break;
    }

    ...

    if (tokens.includes(e)) {
      saveElement("e",e,element.id);
      break;
    }
  } catch (err) {
    console.error(err);
  }
}

如您所想，可能有一种方法可以避免这种长的 if 语句队列...如果您看到，代码中有某种模式，其中唯一不同的是从func() 的结果。

有什么办法可以让这个更干净吗？我的意思是，避免使用意大利面条式代码。

谢谢。

解决方法

改为遍历一组属性名称，并使用 .find 找到第一个匹配的（如果有）：

const properties = ['a','b','c','d','e'];
for (const { id } of elements) {
  try {
    // eslint-disable-next-line no-await-in-loop
    const obj = await func(id);
    const prop = properties.find(prop => tokens.includes(obj[prop]));
    if (prop) {
      saveElement(prop,obj[prop],id);
    }
  }

不再需要 break。