在 if 语句中循环遍历数组以检查是否所有值都通过

Question

我有一个变量 'fieldCount' 等于 5（我拥有的字段数）。如何在不具体说明每个索引的情况下写出以下内容：

if (
   fields[0].checkValidity() && fields[1].checkValidity() && fields[2].checkValidity()
   && fields[3].checkValidity() && fields[4].checkValidity()
) {
    fieldsPass = true;
}

Answer 1

您有一个字段数组，您想要迭代它们，并对每个字段调用有效性检查方法。只有全部通过，flag fieldsPass 才会是 true.

这正是 Array#every 的行为。根据 MDN：

The every() method tests whether all elements in the array pass the test implemented by the provided function.

使用 Array.every 在每个字段上调用 checkValidity()。如果所有字段都有效，则结果将为 true。如果一个字段失败 checkValidity()，循环将立即 return false，而不检查其他字段。

var fieldPass = fields.every(function(field) {
  return field.checkValidity();
})

Answer 2

就像你说的，使用 loop.

var fieldsPass = true;
for (var i = 0; i < fields.length; i++) {
  // Exit early if one of them fails
  if (!fields[i].checkValidity()) {
    fieldsPass = false;
    break;
  }
}

Answer 3

您可以使用.some()方法并反转逻辑来判断是否全部通过，如下所示：

var allPassed = !fields.some(function (field) {
  return !field.checkValidity();
});

Answer 4

你可以这样做：

fieldsPass = true;
for (i = 0; i < fieldCount; i++)
{
     if(!fields[i].checkValidity())
     {
          fieldsPass = false;
          break;
     }
}

Answer 5

您可以使用循环，或一些相当标准的浏览器内置函数。

循环

下面是如何使用循环来完成它。这应该是最快的代码，但您可能不需要最快的代码，除非您要检查大量项目的大量字段。我建议改为 "correct, clear, concise, fast" 优先级，因此认为您应该从内置的浏览器功能开始。但这里仅供参考：

var fieldsPass = true;
var i, l = fields.length;
for (i = 0; i < l; i += 1) {
   if (fields[i].checkValidity()) continue;
   fieldsPass = false;
   break;
}

请注意，在循环外声明 i 变量和在循环外捕获字段长度是可选的。

我做的第一个是因为很多人不知道提升，事实上 for (var i ... 不会创建仅在 for 循环内可用的变量，这与拥有相同在函数顶部声明 var i，此行为可能导致错误。

第二个我出于习惯做了，尽管正如我所说你可以把它放在循环检查中。 See this discussion。如果您确实使用循环方法，您可能正在寻找更好的性能，因此可能希望使用捕获长度方式以获得最佳性能。（如果真的那么重要，您可以使用 var i = fields.length; while (i--) { } 方法。）

浏览器功能Array.Every

您可以使用 Array.prototype.every()（来自 ECMAScript 2015 第 6 版）：

Mozilla Developer Network

The every() method tests whether all elements in the array pass the test implemented by the provided function.

fieldsPass = fields.every(function(field) {
   return field.checkValidity();
});

它 returns true当传入函数时，当运行对数组中的每一项时， returns true 对所有项.如果任何一个 returns false，它停止并且 returns false。在某些语言中，他们将相同的概念称为 all，如果您熟悉的话。

或者，最好只声明一次 checkValidity 函数，而不是将它放在每个字段上。这可能是不可能的，具体取决于您如何实现它（也许它可以访问私有变量？）。请注意，您提供的回调函数的第一个参数（请参阅上面链接中的文档）是迭代的 currentValue，即您要检查的字段。如果您的函数看起来像这样，它将起作用：

function checkValidity(field) { /* check validity */ }

fieldsPass = fields.every(checkValidity);

浏览器功能Array.Some

您也可以使用 Array.prototype.some()（来自 ECMAScript 2015 第 6 版）：

Mozilla Developer Network

The some() method tests whether some element in the array passes the test implemented by the provided function.

fieldsPass = !fields.some(function(field) {
   return !field.checkValidity();
});

请注意，它基本上只是 every 的倒数，因为“ALL VALID”与“NOT（ANY INVALID）”相同。这只是意味着它会检查传递函数的数组中的任何一项，如果是，则 returns true。在某些语言中，他们将相同的概念称为 any，如果您熟悉的话。

一般浏览器兼容性说明

请注意，对于这两个功能，浏览器兼容性非常好。如果您不关心版本 9 以下的 IE，那么您就很安全了。如果你这样做，那么你会想要使用一个 polyfill，它在上面链接的 MDN 页面上可用。您可以将该代码包含在 javascript 文件的全局范围内，然后就可以在 IE 8 及以下版本中正常使用它。（我说的是这样开头的代码块:)

if (!Array.prototype.every) {
   Array.prototype.every = function(callbackfn, thisArg) {
   ...
}

在 if 语句中循环遍历数组以检查是否所有值都通过

Looping through array in if statement to check if all values pass

javascript

arrays

for-loop

checkvalidity

循环

浏览器功能Array.Every

浏览器功能Array.Some

一般浏览器兼容性说明