[JavaScript] URLSearchParams 쿼리 문자열, 파라미터 추출

URLSearchParams는 웹 API 중 하나로, URL의 쿼리 문자열을 쉽게 다룰 수 있도록 도와주는 인터페이스

 

var urlParams = new URLSearchParams(window.location.search); //https://example.com/page?param1=value1&param2=value2&param3=value3

console.log(urlParams.get('param1')); // 출력: "value1"
console.log(urlParams.get('param2')); // 출력: "value2"
console.log(urlParams.get('param3')); // 출력: "value3"

 

 

기능

• 기존 쿼리 문자열을 키-값 쌍으로 파싱합니다.
• 키-값 쌍으로 새로운 쿼리 문자열을 생성합니다.
• 키-값 쌍을 추가, 제거 또는 변경하여 기존 쿼리 문자열을 수정합니다.

주요 메서드

• constructor(searchString?): 새로운 URLSearchParams 객체를 생성합니다. searchString이 제공되면 쿼리 문자열을 파싱합니다.
• append(key, value): 쿼리 문자열에 새로운 키-값 쌍을 추가합니다. 키가 이미 존재하면 값이 쉼표로 구분된 목록으로 추가됩니다.
• delete(key): 쿼리 문자열에서 지정된 키와 값을 제거합니다.
• entries(): 키-값 쌍의 반복자를 반환합니다.
• forEach(callback(value, key, searchParams)): 쿼리 문자열의 각 키-값 쌍에 대해 함수를 호출합니다.
• get(key): 지정된 키와 연결된 값을 반환하거나 키가 존재하지 않으면 null을 반환합니다.
• getAll(key): 지정된 키와 연결된 모든 값의 배열을 반환하거나 키가 존재하지 않으면 빈 배열을 반환합니다.
• has(key): 지정된 키가 쿼리 문자열에 존재하면 true를 반환하고 그렇지 않으면 false를 반환합니다.
• keys(): 쿼리 문자열의 키 반복자를 반환합니다.
• set(key, value): 지정된 키의 값을 설정합니다. 키가 이미 존재하면 값이 바뀝니다.
• sort(): 키를 기준으로 키-값 쌍을 제자리에 정렬합니다.
• toString(): URLSearchParams 객체의 쿼리 문자열 표현을 반환합니다.

 

 

https://developer.mozilla.org/ko/docs/Web/API/URLSearchParams

URLSearchParams - Web API | MDN