回答編集履歴

コメントを受けて修正

2018/11/07 01:29

投稿

スコア36134

test CHANGED Viewed

@@ -165,3 +165,135 @@
 */
 ```
+### コメントを受けて修正
+[サンプル](https://jsfiddle.net/Lhankor_Mhy/Lg89kd5u/)
+(サンプルではわざとtheadの順番を変えてあります)
+```js
+const json = [
+  {
+    "a": "あ",
+    "b": "い",
+    "c": "う",
+    "bodies": [
+      {
+        "d": "え",
+        "e": "お"
+      },
+      {
+        "d": "ええ",
+        "e": "おお"
+      }
+    ]
+  },
+  {
+    "a": "ああ",
+    "b": "いい",
+    "c": "うう",
+    "bodies": [
+      {
+        "d": "えええ",
+        "e": "おおお"
+      },
+      {
+        "d": "ええええ",
+        "e": "おおおお"
+      }
+    ]
+  }
+] ;
+const header = {
+  "d": "メモ",
+  "c": "担当者",
+  "e": "名称"
+};
+const reverseHeader = new Map( Object.entries( header ).map(
+  e => [...e].reverse()
+) );
+const theadArray = Array.from( $('thead th') ).map(
+  e => e.textContent
+);
+const flattenJSON = json.map( e =>
+  e.bodies.map( row => {
+    Object.assign( row, e );
+    return row;
+  } )
+).flat();
+const tbody = flattenJSON.map( row=>`
+      <tr>
+${ theadArray.map( head => `
+          <td>${ row[ reverseHeader.get( head ) ] }</td>
+`).join('') }
+      </tr>
+`).join('');
+$('tbody').html( tbody );
+```