JSFiddle - React, Tailwind, and code Playground

HTML

<div id="demo"></div>

JavaScript

var data = {
  prop1: 'data1',
  prop2: {
    prop21: 'data21',
    prop22: 'data22'
  },
  prop3: {
    prop31: 'data31',
    prop32: {
      prop321: 'data321'
    }
  }
};

var prop = [];
var path = "";

function parseObj(data){

  for(var key in data){

    if ( typeof data[key] === 'object') {
      path += key + "->";
      parseObj(data[key]);
    }else{
      path += key;
      prop.push( { path: path, value: data[key] } );
    }
    path = "";
  }

}

function updated(){
  parseObj(data);

  for(var i = 0; i < prop.length; i++){
    for(var key in prop[i]){
      document.getElementById("demo").innerHTML += key + ': ' + prop[i][key] + '; ';
    }
    document.getElementById("demo").innerHTML += '<br />'
  }

};

updated();