オブジェクトの解析時にTypeErrorオブジェクトが関数ではありません

Question

検索条件に基づいて以下の値を解析し、その結果をテーブルに出力しようとしています。私はコンソールに目的の結果を正しく解析したり、すべての結果をテーブルに出力することができます。以下は、両方の機能をマージする試みです。私はタイプエラーTypeError: obj.list[i].forEach is not a functionで終わる。私はそれがオブジェクトであり、配列ではないので、オブジェクトを正しく解析することができませんでした。オブジェクトを正しく解析するために問題を修正するにはどうすればよいですか？

var obj = { 
 
    "list": [{ 
 
     "name": "my Name", 
 
     "id": 12, 
 
     "type": "car owner" 
 
    }, 
 
    { 
 
     "name": "my Name", 
 
     "id": 13, 
 
     "type": "car owner2" 
 
    }, 
 
    { 
 
     "name": "my Name4", 
 
     "id": 14, 
 
     "type": "car owner3" 
 
    }, 
 
    { 
 
     "name": "my Name4", 
 
     "id": 15, 
 
     "type": "car owner5" 
 
    } 
 
    ] 
 
}; 
 

 
var tableBody = ""; 
 

 
var columns = []; 
 

 
// Create the header record. 
 
tableBody = tableBody + "<tr>"; 
 
for (var prop in obj.list[0]) { 
 
    if (obj.list[0].hasOwnProperty(prop)) { 
 
    // Append properties such as myid, fname, lname etc. 
 
    tableBody = tableBody + ("<th>" + prop + "</th>"); 
 

 
    // Also keep a list of columns, that can be used later to get column values from the 'data' object. 
 
    columns.push(prop); 
 
    } 
 
} 
 
tableBody = tableBody + "</tr>"; 
 

 
var results = []; 
 
var searchField = "name"; 
 
var searchVal = "my Name"; 
 
for (var i = 0; i < obj.list.length; i++) { 
 
    // search term 
 
    if (obj.list[i][searchField] == searchVal) { 
 
    // Create the data rows. 
 
    // I get an error here: 
 
    obj.list[i].forEach(function(row) { 
 
     // Create a new row in the table for every element in the data array. 
 
     tableBody = tableBody + "<tr>"; 
 

 
     columns.forEach(function(cell) { 
 
     // Cell is the property name of every column. 
 
     // row[cell] gives us the value of that cell. 
 
     tableBody = tableBody + "<td>" + row[cell] + "</td>"; 
 
     }); 
 

 
     tableBody = tableBody + "</tr>"; 
 
    }); 
 
    } 
 
} 
 

 
jQuery("#usersTable").append(tableBody);

<table border='1' id="usersTable"></table>

JSFiddle

Working version based on feedback

Answer 1

forEachオブジェクトにこの方法を適用しようとしている提供されたコードでは、それは間違った方法ですが、配列のための反復方法です。オブジェクトのプロパティを反復処理するには、for (var key in object) {"code here"}を使用できます。

var obj = { 
 
    "list": [{ 
 
     "name": "my Name", 
 
     "id": 12, 
 
     "type": "car owner" 
 
    }, 
 
    { 
 
     "name": "my Name", 
 
     "id": 13, 
 
     "type": "car owner2" 
 
    }, 
 
    { 
 
     "name": "my Name4", 
 
     "id": 14, 
 
     "type": "car owner3" 
 
    }, 
 
    { 
 
     "name": "my Name4", 
 
     "id": 15, 
 
     "type": "car owner5" 
 
    } 
 
    ] 
 
}; 
 

 
var tableBody = ""; 
 
var columns = []; 
 
var searchField = "name"; 
 
var searchVal = "my Name"; 
 

 
tableBody = tableBody + "<tr>"; 
 
for (var prop in obj.list[0]) { 
 
    if (obj.list[0].hasOwnProperty(prop)) { 
 
    tableBody = tableBody + ("<th>" + prop + "</th>"); 
 
    columns.push(prop); 
 
    } 
 
} 
 

 
tableBody = tableBody + "</tr>"; 
 

 
for (var i = 0; i < obj.list.length; i++) { 
 
    if (obj.list[i][searchField] == searchVal) { 
 
    tableBody = tableBody + "<tr>"; 
 
    for (var key in obj.list[i]) { 
 
     tableBody = tableBody + "<td>" + obj.list[i][key] + "</td>"; 
 
    }; 
 
    tableBody = tableBody + "</tr>"; 
 
    } 
 
} 
 

 
jQuery("#usersTable").append(tableBody);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table border='1' id="usersTable"></table>