Sometimes you need to blow out a JavaScript object so that the keys are fully qualified. For example, if you are doing a rest query on some third party database, or to represent a more than 1 level deep object in a two dimension space like a spreadsheet.

The problem

Your object looks like this

but you need it to look like this



The code

First – we need to flatten it, so we get this
[{key:[a], value:1},{key:[b], value:2} , {key:[c,d], value:3}, {key:[c,e,f], value:25}]
function  objectSplitKeys (ob,obArray,keyArray) {
  obArray = obArray || [];

  //turns this {a:1,b:2,c:{d:3,e:{f:25}}}
  // into this, so that the keys can be joined to make dot syntax
  //[{key:[a], value:1},{key:[b], value:2} , {key:[c,d], value:3}, {key:[c,e,f], value:25}]
  if (isObject(ob)) {
    Object.keys(ob).forEach ( function (k) {
      var ka = keyArray ? keyArray.slice(0) : [];
      if(isObject(ob[k])) {
        objectSplitKeys (ob[k],obArray,ka);
      else {
        obArray.push ( {key:ka, value:ob[k]} );
  else {
  return obArray;
function isObject (obj) {
 return obj === Object(obj);

and we also need to join the resultant keys with dots.

function objectDot(ob) {
  return objectSplitKeys (ob).map ( function (o) {
     return {key:o.key.join("."), value:o.value};

and finally, put it all together to make a new object with the flattened keys

var dotJob = objectDot (ob).reduce(function(p,c){
           p[c.key] = c.value;
           return p;


For more on this snippets, see: