数组中的类型有问题并试图将事物排序到表中

Trouble with types in arrays and attempting to sort things into tables

基本上这段代码应该产生两个 tables,一个包含数组中的每个类型,它工作正常,另一个包含 materials 具有相同名称的总计

例如假设您输入两个红色油漆实例(10 平方英尺和 5 平方英尺)和两个蓝色油漆实例(30 平方英尺和 10 平方英尺),那么第二个 table 应该显示...

red paint: 15 sqr ft

blue paint: 40 sqr ft.

...但目前它只将与数组中第一个同名的 material 加在一起,然后吐出每个单独的 material,例如

red paint: 15 sqr ft.

blue paint: 30 sqr ft.

blue paint: 10 sqr ft.

我尝试了一些不同的方法,但似乎无法正常工作,有人有什么想法吗?

function wallTableFunction(){
    var tableDiv = document.getElementById("wallTable"),
        table = "<table border='1'>" +
            "<thread><th>Room</th><th>Surface</th><th>Material</th><th>Width</th><th>Height</th><th>Surface Area</th></thread>";

    var totalDiv = document.getElementById("wallTotals"),
        totalTable = "<table border='1'>" +
            "<thread><th>Material</th><th>TOTAL</th></thread>";

    for(var i = 0, j = walls.length; i<j; i++){
        table += walls[i].tableRow();
    }

    for(var k = 0, l = otherWallArray.length; k<l; k++){
        totalTable += otherWallArray[k].totalRow();
    }

    table += "</table>";
    totalTable += "</table>";

    tableDiv.innerHTML = table;
    totalDiv.innerHTML = totalTable;
}

var wallTotals = function(){
    for(var i = 0, j = walls.length; i<j; i++){
        var wallMaterialFinal = walls[i].material;
        var wallResultTotal = walls[i].result;
        var a = new wallThing(wallMaterialFinal, wallResultTotal);
        wallThingArray.push(a);
    }
    otherWallArray[0] = wallThingArray[0];
    wallThingArray[0] = null;
};

window.onload = function() {
    if(localStorage.getItem("wallArray")!== null){
        var storedWalls = JSON.parse(localStorage["wallArray"]);
        for(var i = 0, j = storedWalls.length; i<j; i++){
            var wallRoom = storedWalls[i].room;
            var wallSurf = storedWalls[i].surface;
            var wallMat = storedWalls[i].material;
            var wallWidth = storedWalls[i].width;
            var wallHeight = storedWalls[i].height;
            var wallResult = storedWalls[i].result;
            var a = new Wall(wallRoom, wallSurf, wallMat, wallWidth, wallHeight, wallResult);
            walls.push(a);
        }
        wallTotals();

        for(var q = 0, r = wallThingArray.length; q<r; q++){
            if(wallThingArray[q] != null) {
                for (var s = 0, t = otherWallArray.length; s<t; s++) {
                    if(wallThingArray[q] != null) {
                        if (wallThingArray[q].material == otherWallArray[s].material) {
                            otherWallArray[s].result += wallThingArray[q].result;
                            wallThingArray[q] = null;
                        } else {
                            otherWallArray.push(wallThingArray[q]);
                            wallThingArray[q] = null;
                        }
                    }
                }
            }
        }
        wallTableFunction();
    }
};

当你试图总结时,这里有一个逻辑错误:

for(var q = 0, r = wallThingArray.length; q<r; q++){
    if(wallThingArray[q] != null) {
        for (var s = 0, t = otherWallArray.length; s<t; s++) {
            if(wallThingArray[q] != null) {
                if (wallThingArray[q].material == otherWallArray[s].material) {
                    otherWallArray[s].result += wallThingArray[q].result;
                    wallThingArray[q] = null;
                } else {
                    otherWallArray.push(wallThingArray[q]);
                    wallThingArray[q] = null;
                }
            }
        }
    }
}

最里面的 else 意味着如果该项目与 otherWallArray 中的第一个项目不匹配,它将始终被推入 otherWallArray。相反,您想要的是仅在遍历 每个 行以查找匹配项但一无所获后才推入 otherWallArray

for (var q = 0, r = wallThingArray.length; q<r; q++) {
    var foundMatch = false;
    for (var s = 0, t = otherWallArray.length; s<t; s++) {
        if (wallThingArray[q].material == otherWallArray[s].material) {
            otherWallArray[s].result += wallThingArray[q].result;
            foundMatch = true;
            break;
        }
    }
    if (!foundMatch) {
        otherWallArray.push(wallThingArray[q]);
        wallThingArray[q] = null;
    }
}