자바스크립트 : 문자열 변경 메서드 : slice() / substring() / substr()

문자열 변경 메서드 : slice() / substring() / substr()

slice(), substring(), substr() 메서드는 문자열에서 원하는 값을 추출하여 문자열로 반환합니다. 세 가지 메서드는 모두 비슷하면서도, 작동 방법은 조금씩 다릅니다.

---

slice() 메서드

slice() 메서드는 어떤 배열의 begin부터 end까지(end 미포함)에 대한 복사본을 반환합니다. 두 가지 방법으로 작동시킬 수 있습니다.

1. slice : "문자열".slice(시작 위치)

const str1 = "javascript reference";
const currentStr1 = str1.slice(0);
const currentStr2 = str1.slice(1);
const currentStr3 = str1.slice(2);

결과보기

javascript reference
avascript reference
vascript reference

2. slice : "문자열".slice(시작 위치, 끝나는 위치)

이때, 끝나는 위치의 값이 시작 위치의 값보다 커야 값이 출력됩니다. 위치값을 음수로 입력할 수도 있습니다.

const str1 = "javascript reference";
const currentStr1 = str1.slice(0, 1);
const currentStr2 = str1.slice(0, 2);
const currentStr3 = str1.slice(0, 3);

const currentStr4 = str1.slice(-1);
const currentStr5 = str1.slice(-2);

const currentStr6 = str1.slice(-3, -1);
const currentStr7 = str1.slice(-3, -2);

결과보기

j
ja
jav

e
ce

nc
n

substring() 메서드

substring()은 slice() 메서드와 동일하게 작동합니다. 그러나 slice() 메서드와 달리, 시작 위치값이 끝나는 위치값보다 클 경우, 값을 인식하여 두 값을 바꾸어 처리해 줍니다. 즉, slice()에서 나타날 수 있는 오류를 방지할 수 있는 메서드입니다.

const str1 = "javascript reference";
const currentStr1 = str1.slice(1, 4);
const currentStr2 = str1.slice(4, 1); // 출력되지 않습니다.
const currentStr3 = str1.substring(4, 1); // 값을 바꾸어 출력해줍니다.
const currentStr4 = str1.substring(1, 4);

결과보기

ava
X
ava
ava

substr() 메서드

substr() 메서드 또한 위 메서드들과 유사하지만, 입력하는 값이 조금 다릅니다. 마찬가지로 두 가지 방법으로 작동시킬 수 있습니다.

1. substr() : "문자열".substr(시작 위치)

const str1 = "javascript reference";
const currentStr1 = str1.substr(0);
const currentStr2 = str1.substr(1);
const currentStr3 = str1.substr(2);

결과보기

javascript reference
avascript reference
vascript reference

2. substr() : "문자열".substr(시작 위치, 길이)

const str1 = "javascript reference";
const currentStr1 = str1.substr(0, 1);
const currentStr2 = str1.substr(0, 2);
const currentStr3 = str1.substr(0, 3);

const currentStr4 = str1.substr(-1, 1);
const currentStr5 = str1.substr(-2, 2);
const currentStr6 = str1.substr(-3, 3);

결과보기

j
ja
jav

e
ce
nce