JavaScript substring()을 사용한 문자열 조작. 여러 가지 문자열 조작 기법과 substring()의 활용.

작성일 : 2024-03-25

JavaScript substring()을 사용한 문자열 조작: 여러 가지 문자열 조작 기법과 substring()의 활용

JavaScript에서 문자열을 조작하는 것은 웹 개발에서 매우 일반적이고 중요한 작업입니다. 문자열 조작에는 여러 가지 기법이 있으며, substring() 메서드는 그 중에서도 강력한 도구 중 하나입니다. 이 글에서는 substring() 메서드를 사용하여 문자열을 조작하는 다양한 기법과 활용 방법을 살펴보겠습니다.

substring() 메서드의 기본 개념

substring() 메서드는 문자열의 일부를 추출하여 새로운 문자열을 반환하는 기능을 합니다. 이 메서드는 원본 문자열을 변경하지 않으며, 두 개의 매개변수를 사용하여 추출할 부분의 시작과 끝 인덱스를 지정합니다.

기본 문법


javascript
string.substring(indexStart, indexEnd);

indexStart: 추출을 시작할 인덱스. 이 인덱스는 포함됩니다.
indexEnd (선택 사항): 추출을 끝낼 인덱스. 이 인덱스는 포함되지 않습니다. 지정하지 않으면 문자열의 끝까지 추출합니다.

문자열 조작 기법

부분 문자열 추출

부분 문자열을 추출하는 가장 기본적인 방법은 substring()을 사용하는 것입니다. 이 메서드는 문자열의 특정 부분을 쉽게 추출할 수 있게 해줍니다.

예제: 문자열의 특정 부분 추출


javascript
let str = "Hello, World!";
let result = str.substring(7, 12);
console.log(result); // "World"

위 예제에서는 문자열 Hello, World!에서 인덱스 7부터 12까지의 부분 문자열 World를 추출합니다.

문자열의 시작과 끝 부분 추출

substring() 메서드는 문자열의 시작이나 끝 부분을 추출하는 데 유용하게 사용될 수 있습니다.

예제: 문자열의 시작 부분 추출


javascript
let str = "JavaScript is fun!";
let start = str.substring(0, 10);
console.log(start); // "JavaScript"

위 예제에서는 문자열 JavaScript is fun!의 처음 10문자를 추출하여 JavaScript를 반환합니다.

예제: 문자열의 끝 부분 추출


javascript
let str = "JavaScript is fun!";
let end = str.substring(11);
console.log(end); // "is fun!"

이 예제에서는 인덱스 11부터 문자열의 끝까지 추출하여 is fun!을 반환합니다.

문자열 중간 부분 추출

중간 부분을 추출할 때도 substring() 메서드를 유용하게 사용할 수 있습니다.

예제: 중간 부분 추출


javascript
let str = "Learn JavaScript programming";
let middle = str.substring(6, 16);
console.log(middle); // "JavaScript"

이 예제에서는 Learn JavaScript programming에서 JavaScript를 추출합니다.

문자열 길이 계산 및 부분 추출

문자열의 길이를 계산하여 substring()을 사용할 때 유용한 경우가 많습니다. 예를 들어, 문자열의 중간 부분을 추출하거나, 특정 길이의 문자열을 추출하는 경우입니다.

예제: 문자열 길이 계산 및 부분 추출


javascript
let str = "Mastering JavaScript";
let length = str.length;
let half = Math.floor(length / 2);
let middle = str.substring(half - 3, half + 3);
console.log(middle); // "terin"

이 예제에서는 문자열 Mastering JavaScript의 중간 6자를 추출합니다. 문자열의 길이를 계산하여 중간 위치를 찾고, 그 주위의 6자를 추출합니다.

여러 문자열 조합

substring() 메서드를 사용하여 여러 부분 문자열을 조합하여 새로운 문자열을 만들 수 있습니다.

예제: 문자열 조합


javascript
let str1 = "Hello, ";
let str2 = "world!";
let combined = str1 + str2.substring(0, 5);
console.log(combined); // "Hello, world"

이 예제에서는 Hello, 와 world!의 부분 문자열을 조합하여 Hello, world를 만듭니다.

특정 구분자를 기준으로 문자열 분할

문자열을 특정 구분자를 기준으로 분할하여 substring()을 사용해 필요한 부분만 추출할 수 있습니다.

예제: 이메일 주소에서 사용자명 추출


javascript
let email = "user@example.com";
let atIndex = email.indexOf("@");
let username = email.substring(0, atIndex);
console.log(username); // "user"

이 예제에서는 이메일 주소 🔗 user@example.com에서 @의 위치를 찾아 그 앞의 부분 문자열 user를 추출합니다.

문자열에서 단어 추출

텍스트 문자열에서 특정 단어를 추출할 때 substring() 메서드를 유용하게 사용할 수 있습니다.

예제: 텍스트에서 특정 단어 추출


javascript
let text = "The quick brown fox jumps over the lazy dog";
let start = text.indexOf("brown");
let end = text.indexOf(" ", start);
if (end === -1) end = text.length;
let word = text.substring(start, end);
console.log(word); // "brown"

이 예제에서는 The quick brown fox jumps over the lazy dog에서 brown이라는 단어를 추출합니다.

URL에서 도메인 추출

웹 개발에서 URL에서 특정 부분을 추출하는 작업은 매우 흔합니다. substring() 메서드를 사용하여 URL에서 도메인을 추출할 수 있습니다.

예제: URL에서 도메인 추출


javascript
let url = "https://www.example.com/path?query=123";
let start = url.indexOf("//") + 2; // 2를 더해 "://"를 건너뜁니다.
let end = url.indexOf("/", start);
if (end === -1) end = url.length;
let domain = url.substring(start, end);
console.log(domain); // "www.example.com"

이 예제에서는 url.indexOf("//")를 사용하여 //의 위치를 찾고, 도메인의 시작 위치를 계산합니다. 이후 url.indexOf("/", start)를 사용하여 도메인의 끝 위치를 찾고, substring()을 사용하여 도메인을 추출합니다.

문자열 조작의 중요성

문자열 조작은 데이터 처리, 사용자 입력 검증, URL 처리 등 다양한 분야에서 매우 중요한 역할을 합니다. substring() 메서드는 이러한 문자열 조작 작업을 간편하게 수행할 수 있게 해주는 유용한 도구입니다. 특히, 다른 메서드들과 결합하여 더욱 강력한 문자열 처리 기능을 구현할 수 있습니다.

결론

JavaScript의 substring() 메서드는 문자열의 일부를 추출하여 새로운 문자열을 반환하는 매우 유용한 도구입니다. 이 글에서는 substring() 메서드를 사용하여 다양한 문자열 조작 기법을 살펴보았습니다. 부분 문자열 추출, 시작과 끝 부분 추출, 중간 부분 추출, 문자열 길이 계산, 여러 문자열 조합, 특정 구분자를 기준으로 문자열 분할, 단어 추출, URL에서 도메인 추출 등 여러 가지 활용 방법을 통해 substring() 메서드의 강력한 기능을 확인할 수 있었습니다.

이러한 기법들을 잘 이해하고 활용하면, 웹 개발과 데이터 처리에서 더욱 효율적이고 강력한 문자열 조작 작업을 수행할 수 있을 것입니다. JavaScript의 substring() 메서드를 통해 다양한 문자열 조작 작업을 능숙하게 다루어 보세요.