Convertir URL a Object (JavaScript)

Question

Estoy trabajando en un proyecto personal (utilizando node.js) en el que necesito obtener la ruta de la solicitud GET por ejemplo "/path/to/content", transformarlo en un Objeto y hacer que quede de la siguiente manera:

{
  "path": {
    "to": {
      "content":[...]
     }
  }
}

Me parece que reemplazando con split() podría funcionar, he intentado de la siguiente manera:

const button = document.getElementsByClassName("me");

for (var i=0; i < button.length; i++) {

  button[i].addEventListener("click", function(){
    var str = "/denyncrawford/files/img"; //path de la solicitud
    str = str.slice(1);
    var obj= str.split("/");
    document.querySelector("body").innerHTML += "  <pre>"+JSON.stringify(obj, null, 2)+"</pre>"

    });

}

p span {

  background-color: #f0e4da

}

<p><b>PATH:</b><span>/denyncrawford/files/img</span></p>
<button class="me">Convertir</button>

Y esto me devuelve un Array que contiene las tres strings:

[
  "denyncrawford",
  "files",
  "img"
]

Como podría hacer para convertir el array en una ruta de objeto como en el primer ejemplo?:

{
  "denyncrawford": {
    "files": {
      "img":[...]
     }
  }
}

Porque utilizando Object.assign() resulta de la siguiente manera:

Object.assign({}, obj);
=> 
{
  0:"denyncrawford",
  1:"files",
  2:"img"
}

Espero puedan ayudarme, gracias!.

JSON es un formato, un objeto JS [es otra cosa](https://es.stackoverflow.com/questions/164943/cu%C3%A1l-es-la-diferencia-entre-json-y-un-objeto-en-javascript) — Pablo Lozano, Dec 27 '18 at 17:00
Got it lo edito, gracias!! Algún aporte a la pregunta en si? — Dєηyη Crawford, Dec 27 '18 at 17:02
¿Quieres acumular varias URL a un mismo objeto o quieres crear un objeto para cada URL? — Pablo Lozano, Dec 27 '18 at 17:03

score 4 · Accepted Answer · answered Dec 27 '18 at 17:09

Las funciones de JSON solo funcionan con cadenas que siguen la estructura JSON, no entienden como convertir una ruta. Tienes que construir el objeto tú mismo, split fue un buen punto inicial, aquí un ejemplo:

var path = "/denyncrawford/files/img";

var obj = path
  .split('/')
  .filter(x => !!x)
  .reverse()
  .reduce((prev, current) => {
      return Object.keys(prev).length
        ? { [current]: prev }
        : { [current]: [] };
  }, {});
  
 console.log(obj);

Si, asumí que había que construirlo!! Muchas gracias por la solución! — Dєηyη Crawford, Dec 27 '18 at 17:14

score 1 · Answer 2 · answered Dec 27 '18 at 17:17

Puedes crear una función recursiva que se encargue de hacer el trabajo:

function urlToObject(url,value,target) {
  const param=url.shift();
  target= target || {};
  if (url.length === 0) {
    //caso base
    target[param]=value;
    
  } else {
    if (target[param] == null) {
      target[param]=urlToObject(url,value,{});
    } else {
      target[param]=urlToObject(url,value,target[param]);
    }
  }
  return target;
}

const URL='aplicacion/datos/img';
const URL2='aplicacion/datos/json';
let obj=urlToObject(URL.split('/'),true);

console.log(obj);
obj=urlToObject(URL2.split('/'),1,obj);
console.log(obj);

Esto te permitiría acumular datos en el mismo objeto padre (o no) dependiendo de si lo pasas como tercer parámetro. El segundo parámetro sería el valor final a asignar y el primer parámetro sería el resultado de hacer un split a la URL.

Convertir URL a Object (JavaScript)

2 Answers2