[JavaScript] substring() 메서드 설명 및 예제

728x90

목 차

• 1. substring() 메서드란?
• 2. substring() 메서드 문법
• 3. 주요 특징
• 4. 사용 예제
  • 4-1. endIndex 생략한 경우
  • 4-2. startIndex, endIndex 지정한 경우
  • 4-3. startIndex가 endIndex 보다 큰 경우
  • 4-4. 범위를 초과한 인덱스
  • 4-5. NaN 값을 인덱스 값으로 지정한 경우

반응형

 

1. substring() 메서드란?

• JavaScript의 substring() 메서드는 문자열의 일부를 추출하여 새로운 문자열을 반환하는 문자열 메서드입니다. 이 메서드는 원본 문자열을 수정하지 않고, 추출된 문자열을 반환합니다.

 

---

 

2. substring() 메서드 문법

• startIndex: 추출을 시작할 인덱스(0부터 시작). 이 인덱스의 문자는 결과에 포함됩니다.
• endIndex (선택적): 추출을 종료할 인덱스. 이 인덱스의 문자는 결과에 포함되지 않습니다. 만약 endIndex를 생략하면 문자열의 끝까지 추출합니다.

str.substring(startIndex, endIndex)

 

---

 

3. 주요 특징

1. startIndex와 endIndex가 동일하면 빈 문자열을 반환합니다.
2. startIndex가 endIndex보다 크면 두 인수를 자동으로 교환합니다. 따라서 큰 인덱스가 항상 종료 인덱스로 처리됩니다.
3. 음수나 NaN을 인수로 넣으면 0으로 간주합니다.
4. 범위를 넘어선 인덱스는 문자열의 끝 또는 시작으로 처리됩니다.

 

---

 

4. 사용 예제

4-1. endIndex 생략한 경우

• endIndex를 생략하는 경우, 문자열 끝까지 출력하게 됩니다.

let str = "Hello, World!";

console.log(str.substring(7)); // "World!"

 

4-2. startIndex, endIndex 지정한 경우

• startIndex가 0, endIndex가 5인 경우, 인덱스 0부터 4까지 출력하게 됩니다.

let str = "Hello, World!";

console.log(str.substring(0, 5)); // "Hello"

 

4-3. startIndex가 endIndex 보다 큰 경우

• startIndex가 7, endIndex가 0이지만 두 값이 자동으로 교환되어 substring(0, 7)로 처리됩니다.

let str = "Hello, World!";

console.log(str.substring(7, 0)); // "Hello, "

 

4-4. 범위를 초과한 인덱스

• startIndex 또는 endIndex가 문자열의 길이를 초과하면 문자열의 끝으로 처리됩니다.

let str = "Hello, World!";

console.log(str.substring(7, 20)); // "World!"

 

4-5. NaN 값을 인덱스 값으로 지정한 경우

• 음수나 NaN 값은 모두 0으로 취급됩니다.

let str = "Hello, World!";

console.log(str.substring(-3, 5)); // "Hello"
console.log(str.substring(NaN, 5)); // "Hello"

 

---

 

관련글

• [JavaScript] lastIndexOf() 메서드 설명 및 예제
• [JavaScript] indexOf() 메서드 설명 및 예제
• [javascript] 자바스트립트 형변환 함수 정리