JavaScript 在两个数组中查找匹配的元素 - Javascript

在编程中，有时需要查找两个数组中是否存在相同的元素。在此，我们将学习如何使用 JavaScript 在两个数组中查找匹配的元素。

方法一：使用双重循环

最简单的方法是使用双重循环。将其中一个数组的元素与另一个数组中的元素一一比较，如果有相同的元素，将其添加到一个新的数组中。

const array1 = ['apple', 'banana', 'orange', 'mango'];
const array2 = ['banana', 'kiwi', 'pear', 'apple'];

const matches = [];

for (let i = 0; i < array1.length; i++) {
  for (let j = 0; j < array2.length; j++) {
    if (array1[i] === array2[j]) {
      matches.push(array1[i]);
    }
  }
}

console.log(matches); // ['apple', 'banana']

在这个例子中，我们定义了两个数组 array1 和 array2，然后使用两个嵌套的 for 循环，分别遍历这两个数组。

在内部循环中，我们检查是否有相同的元素。如果有，我们将它添加到新数组 matches 中。

最后，我们输出 matches 数组，其中包含在这两个数组中共存的元素。

方法二：使用数组过滤器

另一种方法是使用 javascript 中的数组过滤器。我们可以使用 filter() 和 includes() 方法。

filter() 方法返回一个新的数组，其中包含通过一个测试函数的所有元素。includes() 方法检查数组是否包含一个指定的值，并返回 true 或 false。

const array1 = ['apple', 'banana', 'orange', 'mango'];
const array2 = ['banana', 'kiwi', 'pear', 'apple'];

const matches = array1.filter(fruit => array2.includes(fruit));

console.log(matches); // ['apple', 'banana']

在这个例子中，我们首先定义了 array1 和 array2 数组。然后，我们使用 filter() 方法进行过滤。通过传递一个测试函数，过滤器返回一个新的数组，其中包含通过测试的所有元素。

在测试函数中，我们使用了 includes() 方法来检查每个元素是否在第二个数组中存在。如果在，则 filter() 方法将此元素添加到新的数组 matches 中。

最后，我们输出 matches 数组，其中包含在这两个数组中共存的元素。

方法三：使用 ES6 中的 Set 对象

直到 ES6 中，JavaScript 没有内置的集合对象。然而，现在 ES6 提供了一个名为 Set 的对象。

Set 对象允许您存储唯一值的集合。我们可以将一个数组转换为一个 Set 对象，然后使用 filter() 和 has() 方法来查找匹配的元素。

const array1 = ['apple', 'banana', 'orange', 'mango'];
const array2 = ['banana', 'kiwi', 'pear', 'apple'];

const set1 = new Set(array1);
const matches = array2.filter(fruit => set1.has(fruit));

console.log(matches); // ['banana', 'apple']

在这个例子中，我们创建了两个数组 array1 和 array2。然后，我们定义了一个新的 Set 对象，并将 array1 数组传递为参数。

接下来，我们使用 filter() 方法过滤第二个数组中的元素，并使用 has() 方法检查每个元素是否在第一个数组（即 Set 对象）中存在。如果存在，则 filter() 方法将其添加到新的数组 matches 中。

最后，我们输出 matches 数组，其中包含在这两个数组中共存的元素。

结论

在本文中，我们讨论了 JavaScript 中查找两个数组中匹配元素的三种方法。

通过使用双重循环，数组过滤器和 ES6 中的 Set 对象，您可以轻松地查找两个数组中共存的元素。

所有三种方法都已经在现代浏览器中广泛支持，因此您可以根据自己的需求选择其中之一，并且在您的开发项目中使用它。