JavaScript 在重复数组中找到丢失的元素

我们的问题是如何编写一个JavaScript程序，可以识别重复数组中缺失的元素。程序的输入将是一个数组，其中包含重复元素，除了一个缺失的元素。程序应该能够识别缺失的元素并将其作为输出返回。

解决这个问题的先决条件是了解JavaScript数组及如何操作数组以找出缺失的元素。我们必须开发一个高效的程序，能够处理包含许多重复元素的大型数组。

问题描述

我们有两个数组，它们是重复的，除了一个元素，其中一个数组中的一个元素缺失了，我们需要找到缺失的元素。

示例

给定以下两个数组 –

输入

[1, 2, 3, 4, 5, 6]
[1, 3, 4, 5, 6]

输出

第二个数组缺少的元素是2。我们需要找到这个缺失的元素。

示例

给定以下两个数组 –

输入

['a', 'b', 'c', 'd', 'e']
['a', 'c', 'd', 'e']

输出

第二个数组中缺少的元素是 b。我们需要找到这个缺失的元素。

现在我们将看一些解决上述问题的方法。

方法 1：使用 for 循环

在这个方法中，我们将迭代遍历第一个数组中的元素，并检查它们是否存在于第二个数组中。如果一个元素在第二个数组中不存在，那么它就是我们的缺失元素。

算法

初始化一个变量来保存缺失的元素。
循环遍历第一个数组。
对于第一个数组中的每个元素，使用嵌套循环检查它是否存在于第二个数组中。
如果该元素在第二个数组中不存在，则将其赋值给缺失的元素变量，并退出嵌套循环。
返回缺失的元素。

示例

<!DOCTYPE html>
<html>
<body>
   <h2>Find the Missing Element in a Duplicated Array</h2>
   <div id="arrays"></div>
   <br>
   <div id="output"></div>
   <script>
      function findMissingElementUsingForLoop(arr1, arr2) {
         let missingElement;
         for (let i = 0; i < arr1.length; i++) {
            let found = false;
            for (let j = 0; j < arr2.length; j++) {
               if (arr1[i] === arr2[j]) {
                  found = true;
                  break;
               }
            }
            if (!found) {
               missingElement = arr1[i];
               break;
            }
         }
         return missingElement;
      }
      const arr1 = [1, 2, 3, 4, 5, 6];
      const arr2 = [1, 3, 4, 5, 6];
      const arraysDiv = document.getElementById("arrays");
      arraysDiv.innerHTML = `Array 1:  ${arr1.join(", ")}<br>Array 2:$ {arr2.join(", ")}`;
      const missingElement = findMissingElementUsingForLoop(arr1, arr2);
      document.getElementById("output").innerHTML = `The missing element is: ${missingElement}`;
   </script>
</body>
</html>

方法2：使用过滤器和indexOf函数

在这种方法中，我们将使用filter函数来找到在两个数组中都不存在的元素，然后我们将使用indexOf函数来返回该元素。

算法

定义一个名为findMissingElementUsingFilterAndIndexOf的函数，该函数以两个数组作为输入。
使用filter函数创建一个新数组，该数组包含在arr1中出现但在arr2中不存在的所有元素。
使用indexOf函数返回新数组中的第一个元素。

示例

<!DOCTYPE html>
<html>
<body>
   <h2>Find the Missing Element in a Duplicated Array</h2>
   <div id="arrays"></div>
   <br>
   <div id="output"></div>
   <script>
      function findMissingElementUsingFilterAndIndexOf(arr1, arr2) {
         const diffArr = arr1.filter(element => !arr2.includes(element));
         return diffArr[0];
      }
      const arr1 = [11, 22, 33, 44, 55, 66];
      const arr2 = [11, 33, 44, 55, 66];
      const arraysDiv = document.getElementById("arrays");
      arraysDiv.innerHTML = `Array 1:  ${arr1.join(", ")}<br>Array 2:$ {arr2.join(", ")}`;
      const missingElement = findMissingElementUsingFilterAndIndexOf(arr1, arr2);
      document.getElementById("output").innerHTML = `The missing element is: ${missingElement}`;
   </script>
</body>
</html>

方法3：使用Reduce函数

在这个方法中，我们将使用reduce函数来找到两个数组中所有元素的和。然后，我们将第二个数组的和从第一个数组的和中减去，就可以得到缺失的元素。

算法

定义一个名为 findMissingElementUsingReduce 的函数，该函数接受两个数组作为输入。
在第一个数组上使用 reduce 函数来计算所有元素的和，并将其赋值给变量 sum1 。
在第二个数组上使用 reduce 函数来计算所有元素的和，并将其赋值给变量 sum2 。
将 sum2 从 sum1 中减去，以获取缺失的元素。
返回缺失的元素。

示例

<!DOCTYPE html>
<html>
<body>
   <h2>Find the Missing Element in a Duplicated Array</h2>
   <div id="arrays"></div>
   <br>
   <div id="output"></div>
   <script>
      function findMissingElementUsingReduce(arr1, arr2) {
         const sum1 = arr1.reduce((acc, curr) => acc + curr, 0);
         const sum2 = arr2.reduce((acc, curr) => acc + curr, 0);
         const missingElement = sum1 - sum2;
         return missingElement;
      }
      const arr1 = [121, 122, 123, 124, 125, 126];
      const arr2 = [121, 123, 124, 125, 126];
      const arraysDiv = document.getElementById("arrays");
      arraysDiv.innerHTML = `Array 1:  ${arr1.join(", ")}<br>Array 2:$ {arr2.join(", ")}`;
      const missingElement = findMissingElementUsingReduce(arr1, arr2);
      document.getElementById("output").innerHTML = `The missing element is: ${missingElement}`;
   </script>
</body>
</html>

方法4：使用Set对象

这是我们最后的一个方法，通过这个方法我们可以找到重复数组中缺失的元素。在这个方法中，我们可以从其中一个数组创建一个新的Set对象，然后检查另一个数组中的每个元素是否存在于Set中。如果一个元素不存在于Set中，则它必定是缺失的元素。

算法

从其中一个数组创建一个新的Set对象。
遍历另一个数组，并检查每个元素是否存在于Set中。
如果一个元素不存在于Set中，则它是缺失的元素。
返回缺失的元素。

示例

<!DOCTYPE html>
<html>
<body>
   <h2>Find the Missing Element in a Duplicated Array</h2>
   <div id="arrays"></div>
   <br>
   <div id="output"></div>
   <script>
      function findMissingElementUsingSet(arr1, arr2) {
         const set = new Set(arr2);
         for (let element of arr1) {
            if (!set.has(element)) {
               return element;
            }
         }
         return null;
      }
      const arr1 = [134, 234, 334, 434, 534, 634];
      const arr2 = [134, 334, 434, 534, 634];
      const arraysDiv = document.getElementById("arrays");
      arraysDiv.innerHTML = `Array 1:  ${arr1.join(", ")}<br>Array 2:$ {arr2.join(", ")}`;
      const missingElement = findMissingElementUsingSet(arr1, arr2);
      const outputDiv = document.getElementById("output");
      if (missingElement !== null) {
         outputDiv.innerHTML = `The missing element is: ${missingElement}`;
      } else {
         outputDiv.innerHTML = "There is no missing element in the arrays.";
      }
   </script>
</body>
</html>