decodeURIComponent() 전역 함수

decodeURIComponent()는 encodeURIComponent()나 유사한 루틴으로 이전에 생성된 URI(Uniform Resource Identifier) 구성 요소를 디코딩하는 전역 함수입니다. 인코딩된 URI 구성 요소를 원래 문자열로 복원할 때 사용됩니다.

출처: decodeURIComponent() - MDN Web Docs

본문

개요

decodeURIComponent() 함수는 이전에 encodeURIComponent() 또는 유사한 루틴으로 생성된 URI 구성 요소를 디코딩합니다.

기본적인 사용 예는 다음과 같습니다.

function containsEncodedComponents(x) {
  // ie ?,=,&,/ etc
  return decodeURI(x) !== decodeURIComponent(x);
}

console.log(containsEncodedComponents("%3Fx%3Dtest")); // ?x=test
// Expected output: true

console.log(containsEncodedComponents("%D1%88%D0%B5%D0%BB%D0%BB%D1%8B")); // шеллы
// Expected output: false

구문(Syntax)

decodeURIComponent(encodedURI)

매개변수

encodedURI — URI(Uniform Resource Identifier)의 인코딩된 구성 요소입니다.

반환값 — 주어진 인코딩된 URI 구성 요소의 디코딩된 버전을 나타내는 새 문자열입니다.

예외(Exceptions)

URIError — encodedURI에 두 개의 16진수 숫자 뒤에 오지 않는 %가 포함되었거나, 이스케이프 시퀀스가 유효한 UTF-8 문자를 인코딩하지 않을 때 발생합니다.

설명(Description)

decodeURIComponent()는 전역 객체의 함수 프로퍼티입니다.

decodeURIComponent()는 decodeURI()에서 설명한 것과 동일한 디코딩 알고리즘을 사용합니다. -.!~*'() 같은 encodeURIComponent가 만들지 않은 것들을 포함한 모든 이스케이프 시퀀스를 디코딩합니다.

예제

키릴 문자 URL 구성 요소 디코딩하기 — 키릴 문자는 퍼센트 인코딩된 UTF-8 시퀀스로 표현되며, decodeURIComponent()가 이를 원래 문자로 복원합니다.

decodeURIComponent("JavaScript_%D1%88%D0%B5%D0%BB%D0%BB%D1%8B");
// "JavaScript_шеллы"

오류 잡기 — 형식이 잘못된 인코딩 시퀀스는 URIError를 던지므로 try...catch로 처리할 수 있습니다.

try {
  const a = decodeURIComponent("%E0%A4%A");
} catch (e) {
  console.error(e);
}

// URIError: malformed URI sequence

URL에서 쿼리 매개변수 디코딩하기 — decodeURIComponent()는 URL의 쿼리 매개변수를 파싱하는 데 직접 사용될 수 없습니다. 약간의 준비가 필요합니다. 쿼리 문자열에서 +는 공백을 의미하므로, 먼저 +를 공백으로 바꾼 뒤 디코딩해야 합니다.

function decodeQueryParam(p) {
  return decodeURIComponent(p.replace(/\+/g, " "));
}

decodeQueryParam("search+query%20%28correct%29");
// 'search query (correct)'

decodeURIComponent() 전역 함수