我有两组对象，我正在推送到两个不同的数组，我正在尝试比较两组数组的对象数量，并且键值对的值是正确的。
<!DOCTYPE html>
<html>
<head>
<script data-require="jquery@*" data-semver="2.1.3" src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body>
<!-- order to build too -->
<table id="bubbleTable" class="heavyTable">
<thead>
<tr>
<th width="12%">Amount</th>
<th width="43%">Vehicle</th>
<th width="20%">Wheels</th>
<th width="25%">Pattern</th>
</tr>
</thead>
<tbody>
<tr align="center" valign="middle" class="row">
<td class="amount">1</td>
<td class="vehicle">
<img src="../images/car1192015.png" class="carChartVersion">
</td>
<td class="wheel">
<img src="../images/wheelsthmb1.png" class="chartVersion">
</td>
<td class="pattern">
<img src="../images/checkerboard1192015.png" class="patternChartVersion">
</td>
</tr>
<tr align="center" valign="middle" class="row">
<td class="amount">2</td>
<td class="vehicle">
<img src="../images/truck1192015.png" class="carChartVersion">
</td>
<td class="wheel">
<img src="../images/wheelsthmb2.png" class="chartVersion">
</td>
<td class="pattern">
<img src="../images/squiggle1192015.png" class="patternChartVersion">
</td>
</tr>
<tr align="center" valign="middle" class="row">
<td class="amount">3</td>
<td class="vehicle">
<img src="../images/van1192015.png" class="carChartVersion">
</td>
<td class="wheel">
<img src="../images/wheelsthmb3.png" class="chartVersion">
</td>
<td class="pattern">
<img src="../images/fire1192015.png" class="patternChartVersion">
</td>
</tr>
</tbody>
</table>
<!-- user Input container -->
<div id="currentOrder" class="ui-dialog-content ui-widget-content" style="width: auto; min-height: 79px; max-height: none; height: auto;">
<div class="vehiclesInBox" id="product6">
<div class="fltLeft positionRelative name6">
<img class="vehicle vehicleInShipment" src="../images/car1192015.png">
<img class="wheelThmbs wheelsInShipment" src="../images/wheels1.png">
<img src="../images/wheelsthmb1.png" class="hidden">
<img class="pattern patternInShipment" src="../images/checkerboard1192015.png">
</div>
<div class="fltRight removeX">–</div>
<div class="clear">
</div>
</div>
<div class="vehiclesInBox" id="product7">
<div class="fltLeft positionRelative name7">
<img class="vehicle vehicleInShipment" src="../images/truck1192015.png">
<img class="wheelThmbs wheelsInShipment" src="../images/wheels2.png">
<img src="../images/wheelsthmb2.png" class="hidden">
<img class="pattern patternInShipment" src="../images/squiggle1192015.png">
</div>
<div class="fltRight removeX">–</div>
<div class="clear"></div>
</div>
<div class="vehiclesInBox" id="product8">
<div class="fltLeft positionRelative name8">
<img class="vehicle vehicleInShipment" src="../images/van1192015.png">
<img class="wheelThmbs wheelsInShipment" src="../images/wheels3.png">
<img class="pattern patternInShipment" src="../images/fire1192015.png">
</div>
<div class="fltRight removeX">–</div>
<div class="clear"></div>
</div>
</div>
<script>
$(document).ready(function() {
//Image variables
var vehicleList = ['../images/car1192015.png', '../images/truck1192015.png', '../images/van1192015.png'];
//set different wheel shapes thumbnails
var wheelThmbs = ['../images/wheelsthmb1.png', '../images/wheelsthmb2.png', '../images/wheelsthmb3.png', '../images/wheelsthmb4.png'];
//images with two wheels
var wheels = ['../images/wheels1.png', '../images/wheels2.png', '../images/wheels3.png', '../images/wheels4.png']
//put within the ship order button
var orderChart = [];
var userInput = [];
$("tr.row").each(function() {
var vehicle = $(this).find(".vehicle img").attr("src");
var wheel = $(this).find(".wheel img").attr("src");
var pattern = $(this).find(".pattern img").attr("src");
var amount = $(this).find(".amount").html();
//check for amount add another object
var vehicleToComplete = {
vehicle: vehicle,
wheel: wheel,
pattern: pattern
}
orderChart.push(vehicleToComplete);
});
$(".vehiclesInBox").each(function() {
var vehicle = $(this).find(".fltLeft .vehicle").attr("src");
var pattern = $(this).find(".fltLeft .pattern").attr("src");
var findWheel = $(this).find(".fltLeft .wheelThmbs").attr("src");
//swapSingleWheel = findWheel;
if (findWheel === wheels[0]) {
findWheel = wheelThmbs[0];
} else if (findWheel === wheels[1]) {
findWheel = wheelThmbs[1];
} else if (findWheel === wheels[2]) {
findWheel = wheelThmbs[2];
}
var userCompleteVehicle = {
vehicle: vehicle,
wheel: findWheel,
pattern: pattern
}
userInput.push(userCompleteVehicle);
});
if (orderChart.length != userInput.length) {
//console.log()
alert("the amount of vehicles in shipped order is incorrect")
}
});
</script>
</body>
</html>
我可以成功地比较两个数组的长度，但我尝试使用直接相等，例如orderChart == userInput（我的数组的变量名称），但我一直得到假结果。任何帮助表示赞赏。谢谢！
答案 0 :(得分：1)
如果您尝试比较对象，结果将始终为false。即使两者具有相同的属性，解释器也总是认为它们是两个不同的对象，所以..
obj1 === obj2 = false.
您需要创建一个函数来比较两个对象的键/值，但如果您不想浪费时间，可以始终使用loadash #isEqual。
答案 1 :(得分：0)
您要执行的是深度相等检查。如果你试图'天真地'比较两个对象只使用'=='或'==='，它将始终返回false（因为JS中的对象通过引用传递）。
这实际上是一个非常有趣的问题：
var a = b = {};
a === b; // true
a == b; // true
var c = {}; var d = {};
c === d; // false
c == d; //false
无论如何......为了检查对象是否与另一个对象相等，您可能想要调查对象中每个字段的值是否等于其他字段的值。出现的问题是：嵌套对象怎么样？你必须检查（即使用递归）。
因此，一种可能的解决方案是：
function equalTo (a, b) {
if (!(typeof a === 'object') && typeof b === 'object'))
|| (a === b))
return true;
var keysA, keysB, equalKeys;
keysA = Object.keys(a);
keysB = Object.keys(b);
equalKeys = kA.some(function (item, i) {
return item === kB[i];
});
if (!equalKeys)
return false;
for (var key in keysA)
return equalTo(a[keysA[key]], b[keysA[key]]);
return false;
}
base：我们正在处理非对象，用'==='检查是否相等。
递归：还没有在非对象中，验证密钥是否相等（如果不相等，则对象不相等）。如果是，对于每个密钥，递归地进行检查。
编辑：如上所述，lodash和下划线都有一个等效的:: isEqual方法（我跟lodash一起去）
ps：这不是一个经过测试的解决方案。这只是为了说明一种做法（你应该使用lodash或其他生产就绪解决方案）