[od0201]

сразу скажу что все работает, но есть пару вопросов, буду рад любому совету или критике

Задача: создать config, на основании которого можно было формировать таблицы (tr th td) с данными из объекта (данные лежат не на первой лини

const config={
  tableLeft:[    
    {"Building dimensions":"general.data.Building dimensions"},
    {"Buildings on lot":"general.data.Buildings on lot"}
  ],
  tableRight:[
    {"Allowed usable floor area":"general.data.Allowed usable floor area"},
    {"Usable floor area as built":"general.data.Usable floor area as built"}
  ]
}
const res=await getObjectOne(id)
document.getElementById(id).querySelector(".product_table.left").insertAdjacentHTML('beforeend', array_to_table(config.tableLeft,res))
document.getElementById(id).querySelector(".product_table.right").insertAdjacentHTML('beforeend', array_to_table(config.tableRight,res))

function array_to_table(array,obj){
  let cls=`cls${Math.floor(Math.random() * 9000) + 1000}`;
  let style=`<style scoped>
  .${cls} th, .${cls}  td { color: #A52A2A;}
  </style>`  
  return `${style}<table class=${cls}> ${array.map(e=>`<tr><th>${Object.keys(e)[0]}<td>${e[Object.keys(e)[0]].split('.').reduce((a,c)=>a[c],obj)}`).join("")}`
}

Главный вопрос: правильно ли я организовал сам config, может есть какие-то стандарты, сам путь к объекту может задавать по другому, чтоб потом не делать .split('.').reduce((a,c)=>a[c],obj)

Второстепенный вопрос: почему не работает "scoped", приходится задавать cls, чтоб стили не лезли на другие таблицы