如何使用三元运算符执行此 IF

Question

如何使用三元运算符执行此操作？

if (img != null) {
  return img;
} else if (!user) {
  return 'img.svg';
} else if (user) {
  if (user.img && !camera) {
    return `imgServer`;
  } else if (!user.img && !camera) {
    return 'img.svg';
  } else if (user.img && camera) {
    return camera;
  } else if (!user.img && camera) {
    return camera;
  }
}

我已经尝试过多种方法，但 none 对我有用。

Answer 1

您可以将语句压缩到此，而无需使用难以理解且易于理解的三进制。

if (img != null) return img;            // maybe this would work, too if (img) return img;
if (!user || !user.img) return 'img.svg';
if (camera) return camera;
return `imgServer`;

更短的方法：

return image
    || (!user || !user.img) && 'img.svg'
    || camera
    || `imgServer`;

Answer 2

如果您不介意使用几个 if 语句..

const imgSvg = 'img.svg' // Maybe use a variable for 'img.svg'?

if (img) return img
if (!user) return imgSvg
return camera || (user.img ? 'imgServer' : imgSvg)

所以..

如果你有img，就return。

如果你没有 img.. 那么下一步要做的是 return 'img.svg' 如果没有 user ..

即.. if (!user) return imgSvg

从那里开始取决于 camera 和 user.img..

即.. return camera || user.img ? 'imgServer' : imgSvg

注意：这与@Nina Scholz 的回答非常相似..但是你有这样的情况：

如果 !user.img 和 camera 存在，return camera

@Nina Scholz 不允许这样做。如有不妥请指正

Answer 3

你确定这里需要三元组吗？就个人而言，我一直发现三元组在最好的时候也很难理解和调试。

我将从简化您的 if 语句树开始。正如其他人所说，您可以将 else if (user) 简化为 `else。给你：

if (img != null) {
  return img;
} else if (!user) {
  return 'img.svg';
} else {
  // simplified because of the previous if statement
  if (user.img && !camera) {
    return `imgServer`;
  } else if (!user.img && !camera) {
    return 'img.svg';
  } else if (user.img && camera) {
    return camera;
  } else if (!user.img && camera) {
    return camera;
  }
}

然后我会通过重新排序来解决使嵌套 if 语句更简单的问题：

if (img != null) {
  return img;
} else if (!user) {
  return 'img.svg';
} else {
  // simplified because of the previous if statement
  if (user.img && !camera) {
    return `imgServer`;
  } else if (!user.img && camera) {
    return camera;
  } else if (user.img && camera) {
    return camera;
  }
  // Since there are four possible states allowed
  // (write out a truth table for proof), we can
  // simplify this nested if statement
  return 'img.svg';
}

现在一切都已简化，您可以解决创建三元组的问题了。首先，嵌套的 if:

if (img != null) {
  return img;
} else if (!user) {
  return 'img.svg';
} else {
  // simplified because of the previous if statement
  return (user.img && !camera) ? `imgServer` :
         (!user.img && camera) ? camera : 
         (user.img && camera) ? camera :
         'img.svg';
}

最后是外部 if 语句：

return (img != null) ? img :
       (!user) ? 'img.svg' :
         (user.img && !camera) ? `imgServer` :
         (!user.img && camera) ? camera : 
         (user.img && camera) ? camera :
         'img.svg';
}

Answer 4

由于您的 if 中有 return 语句，您的代码可能需要进行一些改造... 这是您上面所写内容的直接等价。

let returnValue = img != null ? img : !user ? 'img.svg' : user.img && !camera ? `imgServer` : !user.img && !camera ? 'img.svg' : user.img && camera ? camera : !user.img && camera : camera;
return returnValue;

但老实说，我觉得这个具体的例子可以稍微简化一下...

As pointed out in the comments, since you have return statements, you don't need all those else if and you can compress your logic a bit

以下内容等同于您问题中的代码

if (img != null) return img;
if (!user) return 'img.svg';
if (!camera) {
  if (user.img) return `imgServer`;
return 'img.svg';
}
return camera;

并且如果你绝对想要三进制的，那就是：

let returnValue = img != null ? img : !user ? 'img.svg' : !camera ? user.img ? `imgServer` : 'img.svg' : camera;
return returnValue;

与 Nina Scholz 所做的相比，这将是一个不太紧凑的答案，也可能不像 Nina Scholz 那样优雅，但是如果 if 的顺序和布尔值评估对您很重要，它可能会成功

如何使用三元运算符执行此 IF

How to do this IF with ternary operators

javascript

if-statement

conditional-operator

conditional-statements