检查两个数组在 JavaScript 中是否具有相同的元素

目录

Check if Two Arrays have Same Elements in JavaScript

  1. 检查两个数组在 JavaScript 中是否具有相同的元素
  2. 无论顺序如何,检查两个数组是否具有相同的元素
  3. for使用循环检查两个数组是否具有相同的元素
  4. 使用检查两个数组是否具有相同的元素JSON.stringify()
  5. 检查两个 Set 在 JavaScript 中是否相等

检查两个数组在 JavaScript 中是否具有相同的元素

检查两个数组是否具有相同的元素:

  1. 检查数组是否具有相同的长度。
  2. 使用every()来检查数组是否在相同的索引处包含相同的元素。
  3. 如果数组具有相同的元素,则every()方法将返回,否则返回。truefalse
索引.js
const arr1 = ['a', 'b', 'c']; const arr2 = ['a', 'b', 'c']; function areEqual(array1, array2) { if (array1.length === array2.length) { return array1.every((element, index) => { if (element === array2[index]) { return true; } return false; }); } return false; } console.log(areEqual(arr1, arr2)); // 👉️ true

我们首先检查数组是否具有相同的长度。如果他们不这样做,我们会
false立即返回。

我们传递给Array.every方法的函数
会针对数组中的每个元素进行调用,直到它返回一个虚假值或遍历整个数组。

在每次迭代中,我们检查当前元素是否等于另一个数组中相同索引处的元素。

仅当测试函数在所有迭代中返回真值时every()方法才返回,否则返回true false

如果测试函数返回false,则该every方法短路返回false

只有当传入的数组具有相同的长度、它们的值相等且顺序相同时,areEqual()函数才会返回。true

在此示例中,我们使用areEqual()两个包含相同元素但顺序不同的数组调用函数,函数返回false

索引.js
const arr1 = ['c', 'b', 'a']; const arr2 = ['a', 'b', 'c']; function areEqual(array1, array2) { if (array1.length === array2.length) { return array1.every((element, index) => { if (element === array2[index]) { return true; } return false; }); } return false; } console.log(areEqual(arr1, arr2)); // 👉️ false

检查两个数组是否有相同的元素而不考虑顺序

如果您不关心元素的顺序,而只想检查两个数组是否包含相同的元素,请改用这种方法。

索引.js
const arr1 = ['c', 'b', 'a']; const arr2 = ['a', 'b', 'c']; function areEqual(array1, array2) { if (array1.length === array2.length) { return array1.every(element => { if (array2.includes(element)) { return true; } return false; }); } return false; } console.log(areEqual(arr1, arr2)); // 👉️ true

我们不检查当前元素是否等于另一个数组中具有相同索引的元素,而是检查该元素是否包含在另一个数组中。

我们知道,如果数组具有相同的长度并且一个数组的每个元素都包含在另一个数组中,那么我们有 2 个相等的数组,但顺序可能不同。

如果您需要查找同时存在于两个数组中的数组元素,请使用该
Array.filter()方法。

索引.js
const arr1 = ['a', 'b', 'c', 'd', 'e']; const arr2 = ['a', 'b', 'c']; const intersection = arr1.filter(element => { return arr2.includes(element); }); console.log(intersection); // 👉️ [ 'a', 'b', 'c' ]

我们传递给方法的函数Array.filter()被数组中的每个元素调用。

在每次迭代中,我们检查该元素是否包含在另一个数组中并返回结果。

filter()方法返回一个新数组,该数组仅包含回调函数返回的元素true

或者,您可以使用for循环。

for使用循环检查两个数组是否具有相同的元素

这是一个三步过程。

  1. 检查数组是否不具有相同的长度,如果满足条件,则返回false
  2. 检查第一个数组中的每个元素是否不等于第二个数组中相同索引处的元素。
  3. 如果满足条件,则返回false,否则返回true
索引.js
function areEqual(array1, array2) { if (array1.length !== array2.length) { return false; } for (let index = 0; index < array1.length; index++) { if (array1[index] !== array2[index]) { return false; } } return true; } const arr1 = ['a', 'b', 'c']; const arr2 = ['a', 'b', 'c']; const arr3 = ['z', 'x', 'y']; console.log(areEqual(arr1, arr2)); // 👉️ true console.log(areEqual(arr1, arr3)); // 👉️ false

我们首先检查两个数组的长度是否不同。

如果数组的长度不同,则它们不相等,因此我们
false立即返回。

我们使用for循环遍历第一个数组。

在每次迭代中,我们检查当前元素是否不等于第二个数组中相同索引处的元素。

如果满足条件,则数组不相等,因此我们返回false

否则,函数返回true

或者,您可以使用该JSON.stringify()方法。

检查两个数组是否有相同的元素使用JSON.stringify()

这是一个三步过程:

  1. 使用JSON.stringify()方法将数组转换为 JSON 字符串。
  2. 使用严格相等运算符 (===) 比较字符串。
  3. 如果字符串相等,则两个数组具有相同的元素。
索引.js
function areEqual(array1, array2) { return JSON.stringify(array1) === JSON.stringify(array2); } const arr1 = ['a', 'b', 'c']; const arr2 = ['a', 'b', 'c']; const arr3 = ['z', 'b', 'c']; console.log(areEqual(arr1, arr2)); // 👉️ true console.log(areEqual(arr3, arr2)); // 👉️ false

我们使用该JSON.stringify()方法将两个数组转换为 JSON 字符串并比较字符串。

如果areEqual()函数返回true,则数组具有相同的长度并包含相同的元素,顺序相同。

如果您不想检查数组中元素的顺序,请在调用该JSON.stringify()方法之前对数组进行排序。

索引.js
function areEqual(array1, array2) { const sortedArr1 = [...array1].sort(); const sortedArr2 = [...array2].sort(); return JSON.stringify(sortedArr1) === JSON.stringify(sortedArr2); } const arr1 = ['c', 'b', 'a']; const arr2 = ['b', 'a', 'c']; const arr3 = ['z', 'x', 'y']; console.log(areEqual(arr1, arr2)); // 👉️ true console.log(areEqual(arr3, arr2)); // 👉️ false

在比较方法的输出之前,我们使用Array.sort()该方法对两个数组进行排序JSON.stringify()

我们使用扩展语法 (…) 在对每个数组进行排序之前创建每个数组的浅表副本,因为该Sort()方法对数组进行就地排序。

检查两个 Set 在 JavaScript 中是否相等

检查两个 Set 是否相等:

  1. 比较sizeSets的,如果size不相等,则Sets不相等。
  2. 将第一个转换Set为数组并使用该every()函数对其进行迭代。
  3. 在每次迭代中检查数组元素是否包含在第二个中
    Set
索引.js
function setsAreEqual(a, b) { if (a.size !== b.size) { return false; } return Array.from(a).every(element => { return b.has(element); }); } const set1 = new Set(['a', 'b', 'c']); const set2 = new Set(['c', 'b', 'a']); const set3 = new Set(['a', 'b', 'z']); console.log(setsAreEqual(set1, set2)); // 👉️ true console.log(setsAreEqual(set1, set3)); // 👉️ false if (setsAreEqual(set1, set2)) { // 👇️ this runs console.log('The Set objects are equal'); } else { console.log('The Set objects are NOT equal'); }

我们做的第一件事是检查Set对象是否包含相同数量的元素。

Set.size属性返回存储元素数Set

索引.js
const set1 = new Set(['a', 'b', 'c']); console.log(set1.size); // 👉️ 3

如果sizeSet 对象的 不相等,我们返回false

我们使用Array.from方法将第一个转换Set为数组以便能够使用该Array.every()方法。

索引.js
function setsAreEqual(a, b) { if (a.size !== b.size) { return false; } return Array.from(a).every(element => { return b.has(element); }); }

我们传递给Array.every方法的函数
会针对数组中的每个元素进行调用,直到它返回一个
falsy值或遍历整个数组。

在每次迭代中,我们使用
Set.has
方法检查值是否包含在第二个中
Set

has方法测试 a 中是否存在值Set

索引.js
const set1 = new Set(['a', 'b', 'c']); console.log(set1.has('a')); // 👉️ true console.log(set1.has('z')); // 👉️ false
如果回调函数返回false,则该every() 方法短路并返回false

true该函数仅在第一个元素的所有元素Set都包含在第二个元素中时才返回Set

您还可以使用逻辑与 (&&) 运算符稍微缩短函数。

索引.js
function setsAreEqual(a, b) { return a.size === b.size && [...a].every(element => b.has(element)); } const set1 = new Set(['a', 'b', 'c']); const set2 = new Set(['c', 'b', 'a']); const set3 = new Set(['a', 'b', 'z']); console.log(setsAreEqual(set1, set2)); // 👉️ true console.log(setsAreEqual(set1, set3)); // 👉️ false

我们使用了逻辑与 (&&) 运算符,因此对于返回的函数true,必须满足两个条件。

这两个Set对象必须相同size,并且第一个对象中的所有值都Set必须包含在第二个对象中Set

您还可以使用该lodash.isEqual方法来检查两个Set对象是否相等。

检查两个集合是否相等lodash.isEqual

lodash通过从终端运行以下命令确保已安装。

# 👇️ initialize a package.json file if you don't have one npm init -y npm install lodash

现在您可以导入并使用
isEqual方法。

索引.js
import _ from 'lodash'; const set1 = new Set(['a', 'b', 'c']); const set2 = new Set(['c', 'b', 'a']); const set3 = new Set(['a', 'b', 'z']); console.log(_.isEqual(set1, set2)); // 👉️ true console.log(_.isEqual(set1, set3)); // 👉️ false if (_.isEqual(set1, set2)) { // 👇️ this runs console.log('The Set objects are equal'); } else { console.log('The Set objects are NOT equal'); }

isEqual方法对两个值进行深度比较。

true如果值相等,则该方法返回,false否则返回。

isEqual方法可用于比较数组、对象、Map、Set 等。

额外资源

您可以通过查看以下教程来了解有关相关主题的更多信息: