2020 ES6 / 7 / 8 및 접근
ES6 이상부터 Javascript는이 문제에 대한 성능 솔루션을 만들기 위해 여러 가지 구성을 제공합니다.
여기에는 URLSearchParams 및 반복자 사용이 포함됩니다.
let params = new URLSearchParams('abc=foo&def=%5Basf%5D&xyz=5');
params.get("abc"); // "foo"
사용 사례에서 실제로 객체로 변환해야하는 경우 다음 기능을 구현할 수 있습니다.
function paramsToObject(entries) {
let result = {}
for(let entry of entries) { // each 'entry' is a [key, value] tupple
const [key, value] = entry;
result[key] = value;
}
return result;
}
기본 데모
const urlParams = new URLSearchParams('abc=foo&def=%5Basf%5D&xyz=5');
const entries = urlParams.entries(); //returns an iterator of decoded [key,value] tuples
const params = paramsToObject(entries); //{abc:"foo",def:"[asf]",xyz:"5"}
Object.fromEntries 및 스프레드 사용
우리는 사용할 수 Object.fromEntries를 대체 (4 단계에서 현재 인) paramsToObject와 함께 Object.fromEntries(entries).
반복 할 값 쌍은 키가 이름이고 값이 값인 목록 이름-값 쌍입니다.
는 호출하는 대신 스프레드 연산자 를 사용하여 반복 가능한 객체를 URLParams반환 하므로 스펙마다 항목을 생성합니다..entries
const urlParams = new URLSearchParams('abc=foo&def=%5Basf%5D&xyz=5');
const params = Object.fromEntries(urlParams); // {abc: "foo", def: "[asf]", xyz: "5"}
참고 : 모든 값은 URLSearchParams 사양에 따라 자동으로 문자열입니다
여러 개의 동일한 키
으로 @siipe는 지적, 여러 개의 동일한 키 값이 포함 된 문자열은 사용 가능한 마지막 값으로 강제됩니다 foo=first_value&foo=second_value본질적으로 될 것이다 {foo: "second_value"}.
이 답변에 따라 https://stackoverflow.com/a/1746566/1194694 그것으로 무엇을 해야할지 결정하는 데 대한 사양이 없으며 각 프레임 워크가 다르게 작동 할 수 있습니다.
일반적인 사용 사례는 두 개의 동일한 값을 배열로 결합하여 출력 객체를 다음과 같이 만드는 것입니다.
{foo: ["first_value", "second_value"]}
다음 코드를 사용하면됩니다.
const groupParamsByKey = (params) => [...params.entries()].reduce((acc, tuple) => {
// getting the key and value from each tuple
const [key, val] = tuple;
if(acc.hasOwnProperty(key)) {
// if the current key is already an array, we'll add the value to it
if(Array.isArray(acc[key])) {
acc[key] = [...acc[key], val]
} else {
// if it's not an array, but contains a value, we'll convert it into an array
// and add the current value to it
acc[key] = [acc[key], val];
}
} else {
// plain assignment if no special case is present
acc[key] = val;
}
return acc;
}, {});
const params = new URLSearchParams('abc=foo&def=%5Basf%5D&xyz=5&def=dude');
const output = groupParamsByKey(params) // {abc: "foo", def: ["[asf]", "dude"], xyz: 5}