Как в js из window.location.search получить обьект с нужными типами?

Question

[Ivan Huk]

есть строка localhost/search?cityId=1&delivery=true

нужно розпарсить так чтобы получилось

{
cityId: 1,
delivery: true
}

сейчас

{
cityId: "1",
delivery: "true"
}

Comments

[Алексей Уколов]

Покажите "розпарсер" свой.

[Ivan Huk]

Алексей Уколов,

qs

const newParams = qs.parse(window.location.search..slice(1));

[Артем]

А в чем проблема?

[Ivan Huk]

Kp18, Так проблема в том, что мне нужно получить из строки тип bool а получаю string

[Артем]

Вы можете прогнать строку с булеваром через if{}else{} и заменить строку уже на булевое значение, также для транформации строки в число можно использовать метод Number.parseInt(string)

[Артем]

Предположим

if(obj.delivery=="true"){obj.delivery=true}else obj.delivery=false

[Ivan Huk]

Kp18, это пример строки, а там будут вложенные обьекты и не только булевие значения

[Артем]

eval() вам в помощь для преобразования строки в объект

Answer 1

[Tim]

const search = window.location.search;
const result = search.slice(search.indexOf('?') + 1).split('&').reduce((params, hash) => {
      let [key, val] = hash.split('=')
      return Object.assign(params, {[key]: decodeURIComponent(val)})
  }, {})
console.log(result)

Comments

[Алексей Уколов]

Как это решает задачу приведения типов?

[Tim]

Алексей Уколов,

const search = window.location.search;
const result = search.slice(search.indexOf('?') + 1).split('&').reduce((params, hash) => {
    let [key, val] = hash.split('=')
    let value = decodeURIComponent(val);
    if (!isNaN(Number(value))) {
        value = +value
    } else if (Boolean(value)) {
        value = !!value
    }

    return Object.assign(params, {
        [key]: value
    })
}, {})
console.log(result)

[Алексей Уколов]

C Boolean работать не будет - конструктор всё сожрёт и любая строка превратится в true. А то, что теоретически должно было бы превратиться в false, в условие не зайдёт.

[Tim]

Алексей Уколов, ну в контексте этой задачи я не вижу строк

[Tim]

которые должны остаться строкой

[Алексей Уколов]

Так там всё строки. Ну, например, "false" превратится в true.

[Алексей Уколов]

Это же, я так понимаю, поисковая строка, а в ней обычно есть какой-то текст помимо фильтров.

[Tim]

Алексей Уколов,

const search = window.location.search;
const result = search.slice(search.indexOf('?') + 1).split('&').reduce((params, hash) => {
    let [key, val] = hash.split('=')
    let value = decodeURIComponent(val);
    let b = ['true', 'false'];
    if (!isNaN(Number(value))) {
        value = +value
    } else if (b.includes(value)) {
        value = !!value
    }

    return Object.assign(params, {
        [key]: value
    })
}, {})
console.log(result)

[Дмитрий Беляев]

Tim, boolean по прежнему работает некорректно, ключи нужно тоже декодить

[Tim]

Дмитрий Беляев, я просто показал в каком направлении идти автору. Может быть еще много нюансов

Answer 2

[Алексей Ярков]

Посмотрите на URLSearchParams

Answer 3

[Алексей Уколов]

Поскольку в GET-параметрах нет информации о типах, вам придётся приводить данные вручную. Если объекты сложные, можно делать это рекурсивно, но логику всё равно написать придётся.

Answer 4

[Somewhere Intech]

const params = [...new URLSearchParams(window.location.search).entries()].reduce((r, [k,v]) => { r[k] = v; return r; }, {})