best way to convert from string to javascript object

Question

I have this string:

periodRows.soccer.on:1,periodRows.soccer.periods:1,periodRows.soccer.prematchPeriods=1,periodRows.soccer.label:1st Half

What is the best way to convert it to this object?

periodRows: {
    soccer: {
      on: 1,
      periods: 1,
      prematchPeriods: 1,
      label: '1st Half',
    }
}

Note that I do not control the string, therefore I can not change it.

Thank you

Answer 1

Improved recursive solution

const rec = (tokens, index, target) => {
  const prop = tokens[index];
  if (tokens.length - 1 === index) {
    const [lastProp, value] = prop.split(/[:=]/);
    target[lastProp] = value;
    return target[lastProp];
  }
  if (prop && !target[prop]) {
    target[prop] = {}; 
  }
  return target[prop];
}

"periodRows.soccer.on:1,periodRows.soccer.periods:1,periodRows.soccer.prematchPeriods=1,periodRows.soccer.label:1st Half".split(',').reduce((acc, val) => {
  const tokens = val.split('.');
  let target = acc;

  for (let i = 0; i < tokens.length; i++) {
    target = rec(tokens, i, target);
  }
  return acc;
}, {});

By default JS cannot recognize numbers inside of strings. You have to cast it explicitly. You can update code of rec function with this piece.

if (tokens.length - 1 === index) {
  const [lastProp, stringValue] = prop.split(/[:=]/);
  const parsedValue = +stringValue;
  const value = Number.isNaN(parsedValue) ? stringValue: parsedValue;
  target[lastProp] = value;
  return target[lastProp];
}

Answer 2

Functionally, a bit shorter.

const f = (obj, keyPath, value) => {
    if (keyPath.length === 0) {
        return Number.isNaN(Number(value)) ? value : Number(value);
    }

    const key = keyPath[0];

    if (!obj[key]) {
        obj[key] = {};
    }

    obj[key] = f(obj[key], keyPath.slice(1), value);
    return obj;
};

const str = "periodRows.soccer.on:1,periodRows.soccer.periods:1,periodRows.soccer.prematchPeriods=1,periodRows.soccer.label:1st Half";

str.split(",")
.map(token => token.split(/[:=]/))
.map(record => ({keyPath: record[0].split("."), value: record[1]}))
.reduce((obj, item) => f(obj, item.keyPath, item.value), {});

Answer 3

The string format you have above is in bad format, the only way to convert it is by first converting it into a string in json-like format, something like the following (notice a json-like string should always be enclosed by {}):

var periodRows = '{"soccer":{"on":1,"periods":1,"prematchPeriods":1,"label":"1st Half"}}';

Then you'd be able to perform the conversion:

//String to Json
const str = JSON.parse(periodRows);
console.log (str);

//Json to string
var periodRows = {
    soccer: {
      on: 1,
      periods: 1,
      prematchPeriods: 1,
      label: '1st Half',
    }
}
var myStr = JSON.stringify(periodRows);
console.log (myStr);