Iinsert values into url

Question

I have a function which receives an object and a string. How can I nicely put values from an object into a string

const str = "/api/items/%id%/%name%";

let obj = { id  : 20, name: 'John Dow'};

function path(obj, str){ 
 let res = //some code 
 return res 
}

the function should return "/api/items/20/John%20Dow"

does not come up with a good solution. help me please

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals or https://stackoverflow.com/questions/610406/javascript-equivalent-to-printf-string-format would be my first two suggestions. — CBroe, Mar 29 '22 at 12:04

Sascha Geier · Answer 1 · 2022-03-29T12:23:26.207

0

The following function will do the trick:

const str = "/api/items/%id%/%name%";

let obj = { id  : 20, name: 'John Dow'};

function path(obj, str){ 
 for(const [key, value] of Object.entries(obj)) {
    str = str.replace(`%${key}%`, encodeURI(value))
 }
 return str; 
}

console.log(path(obj, str))

edited Mar 29 '22 at 12:23

answered Mar 29 '22 at 12:14

Sascha Geier

153
11

"/api/items/20/John%20Dow" I can't figure out how to do this? -- John%20Dow – Dima Karpov Mar 29 '22 at 12:25
you just need to call the function ``path()`` with your ``obj`` and ``str``: ``const url = path(obj, str);`` – Sascha Geier Mar 29 '22 at 12:26

score 0 · Answer 2 · answered Mar 29 '22 at 12:15

0

use template string with encodeURI method

let obj = { id  : 20, name: 'John Dow'};

const apiItemsPath = ({id, name}) => `/api/items/${id}/${encodeURI(name)}`

console.log(apiItemsPath(obj))

answered Mar 29 '22 at 12:15

shutsman

2,357
1
12
23

score 0 · Answer 3 · answered Mar 29 '22 at 12:19

you can use :

Object.keys to iterate on object property
string.replace to replace element in your string
encodeUri to change special character to url encoded character

const str = "/api/items/%id%/%name%";

let obj = {
  id: 20,
  name: 'John Dow'
};

function path(obj, str) {
  let res = str;
  Object.keys(obj).forEach(key => {
    res = res.replace(`%${key}%`, encodeURI(obj[key]));
  });
  return res;
}

console.log(path(obj, str));

score 0 · Answer 4 · answered Mar 29 '22 at 12:23

i guess if your object variables doesn't have a / for a first character, you can do this:

let obj = { id  : 20, name: 'John Dow'};

function path(obj, str = "") {
    let res = "";
    str.split("%").forEach((e) => {
        res += e && e[0] != "/" ? obj[e] : e;
    })
    return res;
}

score 0 · Answer 5 · answered Mar 29 '22 at 12:27

const obj = { id: 20, name: 'John Dow' };

const str = '/api/items/%id%/%name%';

const makePath = (obj, str) => {
    const items = str.match(/%.[a-zA-Z]+%/g);
    let newStr = str;

    for (const item of items) {
        newStr = newStr.replace(item, obj[item.replace(/%/g, '')]);
    }

    return encodeURI(newStr);
};

console.log(makePath(obj, str));

score 0 · Answer 6 · edited Mar 30 '22 at 09:32

0

const makePath = (obj, str) => {    
 Object.keys(obj).reduce((acc, key) => acc.replace(%${key}%, encodeURI(obj[key])), 
 str)
 return str;
}

edited Mar 30 '22 at 09:32

Jakub Kurdziel

3,216
2
12
22

answered Mar 29 '22 at 13:59

Dima Karpov

9
1

Please don't post only code as answer, but also provide an explanation what your code does and how it solves the problem of the question. Answers with an explanation are usually more helpful and of better quality, and are more likely to attract upvotes. – Mark Rotteveel Mar 30 '22 at 16:12

Iinsert values into url

6 Answers6