자바스크립트 "URL API"

JavaScript URL API는 JavaScript에서 URL(Uniform Resource Locator) 작업을 위한 메서드를 제공하는 내장 인터페이스입니다. URL을 구성 요소 부분으로 구문 분석하고, 새 URL을 구성하고, 기존 URL을 수정하는 등 URL을 쉽게 조작할 수 있습니다.

​

다음은 JavaScript URL API를 사용하는 방법을 보여주는 몇 가지 샘플입니다.

​

1. URL 구문 분석:

URL을 구문 분석하려면 URL 문자열을 인수로 사용하고 URL의 여러 구성 요소를 나타내는 속성이 있는 `URL` 개체를 반환하는 `URL` 생성자 함수를 사용할 수 있습니다.

​

const urlString = 'https://www.example.com/path/to/resource?key=value#fragment';

const url = new URL(urlString);

​

console.log(url.protocol); // output: 'https:'

console.log(url.host); // output: 'www.example.com'

console.log(url.pathname); // output: '/path/to/resource'

console.log(url.search); // output: '?key=value'

console.log(url.hash); // output: '#fragment'

​

2. URL 구성:

새 URL을 생성하려면 `URL` 생성자 함수를 사용하고 `set` 메서드를 사용하여 해당 속성을 설정할 수 있습니다.

​

const url = new URL('https://www.example.com');

url.pathname = '/path/to/resource';

url.searchParams.set('key', 'value');

​

console.log(url.toString()); // output: 'https://www.example.com/path/to/resource?key=value'

​

또는 `URLSearchParams` 생성자를 사용하여 새 검색 매개변수 개체를 만들고 해당 값을 설정할 수 있습니다.

​

const searchParams = new URLSearchParams();

searchParams.set('key1', 'value1');

searchParams.set('key2', 'value2');

​

const url = new URL('https://www.example.com');

url.search = searchParams.toString();

​

console.log(url.toString()); // output: 'https://www.example.com/?key1=value1&key2=value2'

​

3. URL 수정:

기존 URL을 수정하려면 원래 URL 문자열에서 `URL` 객체를 만들고 해당 속성과 메서드를 사용하여 변경할 수 있습니다.

​

const urlString = 'https://www.example.com/path/to/resource?key=value#fragment';

const url = new URL(urlString);

​

url.pathname = '/new/path';

url.searchParams.set('newkey', 'newvalue');

url.hash = 'newfragment';

​

console.log(url.toString()); // output: 'https://www.example.com/new/path?newkey=newvalue#newfragment'

​

전반적으로 JavaScript URL API는 JavaScript 코드에서 URL로 작업할 수 있는 편리하고 강력한 방법을 제공합니다.