Javascript if语句多个允许条件

Question

在JS中，我想检查扩展名是否以“png”、“jpg”或“gif”结尾。我知道可以使用switch语句来完成此操作，但我想知道是否有更简单的方法将其全部放入if条件语句中。例如：

可能是重复问题：
Javascript: The prettiest way to compare one value against multiple values
Javascript If statement used to check file extensions not working

    if (aExtensions[i].toLowerCase() == ('jpg' || 'png' || 'gif')) {}

最佳实现方法是什么？

- JVG

Answer 1

你可以像这样使用数组：

您可以像这样使用数组：

var extensions = ["jpg", "png", "gif"];

if (extensions.indexOf(aExtensions[i].toLowerCase()) > -1) {
    // match
}

在这种情况下，你需要存储“有效”的扩展名。然后，你可以使用 Array 的 indexOf 方法来查找数组中的任何项目是否与你正在查看的特定扩展名匹配 - 检查值是否为0或更大。 indexOf 在旧浏览器上不受支持，因此你需要包含一个垫片来支持它。有几种解决方案可供选择。

当然，如果你只想使用if语句，可以使用以下格式：

var ext = aExtensions[i].toLowerCase();
if (ext == "jpg" || ext == "png" || ext == "gif") {
    // match
}

我能想到的另一种可能性是使用 switch 语句，如下：

var ext = aExtensions[i].toLowerCase();

switch (ext) {
    case "jpg":
    case "png":
    case "gif":
        // match
        break;
    case default:
        // No match
}

我也许可以把它加上（其他答案肯定是先提出来的），但我想到的另一个方法是使用正则表达式，例如：

if (/jpg|png|gif/i.test(aExtensions[i])) {
    // match
}

但请注意，您将永远无法单独获取这些扩展，并且这就是为什么我更喜欢我提供的前两个选项之一的原因。

- Ian

Answer 2

那么正则表达式呢？

if ( /jpg|png|gif/i.test( aExtensions[i] ) ) {
  ...
}

- elclanrs

---

+1 - 在那些情况下，我绝对更喜欢使用正则表达式。 - jAndy

好的回答。你能解释一下这里 i 的目的是什么吗？ - JVG

i 是 RegExp 的不区分大小写标志。 - Paul S.

有趣。谢谢@PaulS。 - JVG

Answer 3

另一种实现方式是使用对象字面量，如下所示：

if ({'jpg':1,'png':1,'gif':1}[aExtensions[i].toLowerCase()]) {
    // ...
}

这种方式是为了查看匿名对象{'jpg':1,'png':1,'gif':1}是否具有属性，该属性将通过if语句为真。 1满足此条件，undefined则不满足。

---

如果您正在使用一个对象，您也可以利用in运算符（正如Ian所指出的）来判断该对象是否具有该键，而与其值无关，如果是，则返回true。

if (aExtensions[i].toLowerCase() in {'jpg':0,'png':1,'gif':2}) {
    // ...
}

请注意这次即使是'jpg':0，'jpg'仍然可以通过。

- Paul S.

---

@PaulS：in 运算符与for-in 语句完全独立且没有关联。in运算符仅返回命名属性是否存在于对象或对象的原型链中。 - josh3736

@josh3736 谢谢你为我澄清这个问题！ - Paul S.

此外，+1，因为这是解决此问题的最佳性能方式。遍历数组很慢；对象键查找非常快。 - josh3736

@josh3736 是的，我也有这种感觉，因为“in”在两种不同的情况下使用，它们是两个不同的东西。 - Ian

@josh3736（我本来就想写这个，但一直没写）抱歉，我的意思不是让你觉得我不同意你。我的主要观点是indexOf和key in obj在本质上是不同的，因为indexOf不是一个键查找...它必须遍历每个项（键），获取其值，然后与该值进行比较。而key in obj只需要遍历每个项（键）并将其与该项进行比较。即使作为快速查找，它也必须“遍历”每个项，就像数组中的indexOf一样。数组和对象都以相同的方式存储-键/值，只是我们看不到数组的键。 - Ian

Answer 4

你可以使用变量和三重比较，但那很丑陋。

或者你可以使用一个数组，并检查字符串是否包含在其中。

if (~ ["jpg", "png", "gif"].indexOf(aExtensions[i].toLowerCase()) …

然而，由于复杂的!= -1比较以及旧版IE浏览器中缺乏本地indexOf函数，人们倾向于使用正则表达式：

if (/jpg|png|gif/i.test(aExtensions[i])) …

- Bergi