JSFiddle - React, Tailwind, and code Playground

JavaScript

let configObjects = {
	'ball1':{
		'class':'Ball',
		'config':{
			'radius':40,
			'color':'red',
		}
	},
  'ball2':{
		'class':'Ball',
		'config':{
			'radius':50,
			'color':'green',
		}
	},
  'box1':{
  	'class':'Box',
		'config':{
			'color':'black',
		}
  }
};
class Box{
	constructor(config){
  	Object.assign(this,config);
  }
  draw(){
  console.info("I am "+ this.color +" Box!!!");
  }
}
class Ball{
	constructor(config){
    Object.assign(this,config);
  }
  draw(){
    console.info("I am "+ this.color +" Ball!!!");
  }
}
class Room{
	constructor(configObjects){
  	for(let key in configObjects){
  /** можно и ассоциативный массив бахнуть или через switch. if - просто для 			 примера*/
    	if(configObjects[key].class === 'Ball'){
         let obj = new Ball(configObjects[key].config);
         obj.draw();
      }
      if(configObjects[key].class === 'Box'){
         let obj = new Box(configObjects[key].config);
         obj.draw();
      }
      
       /** Было бы очень удобно если можно было бы просто написать 
       let obj = new configObjects[key].class(configObjects[key].config);
       или 
       let obj = new configObjects[key][class](configObjects[key].config);
       Но так увы нельзя.
       */
    }
  }
}
let room = new Room(configObjects);