数据结构
网络
关系数据库管理系统
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 语言编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
服装设计
法律研究如何使用 jQuery/JavaScript 比较两个 JavaScript 数组对象？
在 JavaScript 中，数组是一个对象，其索引作为键，数组值作为数组对象特定键的值。有时，我们需要检查两个数组是否相同。
首先想到的解决方案是使用相等运算符并像 array1 == array2 那样进行比较。糟糕！这行不通，因为数组是一个对象，我们不能直接在 JavaScript 中比较两个对象。因此，我们必须比较数组的每个元素。
在本教程中，我们将学习使用各种方法比较两个 JavaScript 数组对象。
使用 JavaScript 的 sort() 方法并比较每个元素
sort() 方法允许我们对 JavaScript 中的数组值进行排序。之后，我们可以使用 for 循环来比较数组中每个索引处的元素。如果任何索引处的元素不匹配，我们可以说这两个数组对象是不同的。
语法
用户可以按照以下语法使用 sort() 方法和 for 循环比较两个数组对象。
// sort arrays first
arra1.sort();
array2.sort();
if (array1.length != array2.length) {
// arrays are not the same
} else {
for () {
// if elements at index i are not the same, return false
}
}
}
// both arrays are the same
算法
用户可以按照以下算法。
步骤 1 − 使用 sort() 方法对两个数组进行排序。
步骤 2 − 比较两个数组的长度；如果长度不同，则返回 false，表示两个数组不相同。
步骤 3 − 如果两个数组的长度相同，则使用 for 循环遍历两个数组。
步骤 4 − 比较两个数组中每个索引处的元素，如果索引处的元素不匹配，则返回 false。
步骤 5 − 如果两个数组中的所有元素都匹配，则这两个数组相同。
示例
在下面的示例中，我们创建了两个数字数组并使用 sort() 方法对它们进行排序。之后，我们使用 for 循环比较两个数组的每个元素。
在输出中，用户可以看到这两个数组是相同的，因为两个数组包含相同的值。
<html>
<body>
<h3>Using the <i>array.sort()</i> method and <i>for</i> loop to check if two arrays are the same using JavaScript </h2>
<button onclick = "checkArray()"> Compare arrays </button>
<div id = "output"> </div>
<script>
let output = document.getElementById('output');
let array1 = [32, 32, 54, 1, 2, 3, 4];
let array2 = [1, 2, 3, 4, 32, 54, 32];
output.innerHTML += "The first array values are " + array1 + "<br>";
output.innerHTML += "The second array values are " + array2 + "<br>";
function checkArray() {
array1.sort();
array2.sort();
if (array1.length != array2.length) {
output.innerHTML += "Both arrays are not same!";
return false;
} else {
for (let i = 0; i < array1.length; i++) {
if (array1[i] != array2[i]) {
output.innerHTML += "Both arrays are not same!";
return false;
}
}
}
output.innerHTML += "Both arrays are the same!";
return true;
}
</script>
</body>
</html>
使用 forEach 循环和 indexOf() 方法
我们可以使用 forEach 循环遍历每个数组元素。indexOf() 方法查找元素在数组中的第一次出现，如果引用数组不包含该元素，则返回 -1。
语法
用户可以按照以下语法使用 forEach 循环和 indexOf() 方法来比较两个数组对象。
if (array2.length != array1.length) {
// array are not the same
return false;
} else {
array1.forEach((element) => {
if (array2.indexOf(element) == -1) {
return false;
}
})
}
算法
在此算法中，我们不需要像第一种方法那样对数组进行排序。
步骤 1 − 检查两个数组的长度是否相同；如果不是，则返回 false。
步骤 2 − 如果长度相同，则使用 forEach() 循环遍历每个元素。
步骤 3 − 对于 array1 的每个元素，使用 indexOf() 方法检查它是否在 array2 中存在。
步骤 4 − 如果 indexOf() 方法对任何单个元素返回 -1，则表示这两个数组不相同。
示例
在下面的示例中，当用户单击按钮时，它将调用 compareArray() 函数。compareArray() 函数比较两个字符串元素数组。
在输出中，用户可以观察到这两个数组不相同，因为两个数组的值不同。
<html>
<body>
<h3>Using the <i>forEach() loop and indexOf() method</i> to check if two arrays are the same using JavaScript </h3>
<button onclick = "compareArray()"> Compare arrays</button>
<div id = "output"> </div>
<script>
let output = document.getElementById('output');
let array1 = ["Hello", "Hi", "How"];
let array2 = ["Are", "You", "!"];
output.innerHTML += "The first array values are " + array1 + " <br>";
output.innerHTML += "The second array values are " + array2 + " <br>";
function compareArray() {
var isSame = true;
if (array2.length != array1.length) {
output.innerHTML += "Both arrays are not same!";
return false;
} else {
array2.forEach((element) => {
if (array1.indexOf(element) == -1) {
isSame = false;
}
})
}
if (isSame) {
output.innerHTML += "Both arrays are the same!";
} else {
output.innerHTML += "Both arrays are not same!";
}
return true;
}
</script>
</body>
</html>
我们学习了两种在 JavaScript 中比较两个数组的不同方法。用户可以使用第一种方法来比较包含重复值的数组，第二种方法仅用于比较包含唯一值的数组。
此外，用户还可以使用 JSON.stringify() 方法来比较对象数组和排序数组。
4K+ 浏览量
