JavaScript 에서 문자열을 다뤄보자 !! ( substring, substr, slice)

안녕하세요 !!! 

오늘은 문자열 다뤄보겠습니다 ! 

substring, substr, slice, split 요너석들 입니다 !! 

 

첫번째 

substring

일단 기본적으로 문자열을 분할하거나 임의의 개수를 추출할 때에 자주 이용되고 있습니다.

사용법은?

let str = '012345'
str.substring(start, end);

한번 연습을 해볼까요? 

자 밑에와 같이 됩니다 ! 

대충 감이 오시나요? start ~ end 까지 나옵니다 !!! 

다 좋은데 ! substring로만은 뒤에서 가져오는것에 대해서는 한계가 있습니다 ㅜㅜ 아무래도 두번째 인자로 end값을 지정해주니까요 ! 

 

자 그러면 이와 비슷한 substr에 대해서 알아보겠습니다 ! 

 

두번째

substr

어? 이름이 엄청 비슷한데? 라고들 많이 생각하셨죠?? 

하지만 사용법은 비슷하면서 다릅니다 ! 

let str = '012345'
str.substr(start, length);

이번엔 뒤에가 length 입니다 ! 

결과값이 엄청비슷하죠?? 

하지만 ! 엄염히 다릅니다 !!! substring 는 시작지부터 끝지점이였다면 !! 

substr은 시작지부터 몇개를 뽑아올거냐 ! 이기 때문입니다 !! 

잘 유용하게 써주세요 !!! 

vscode에서 써보니 자동완성이 안되네요 ㅜㅜ ( 지원을 안한다고 합니다 ! ) 

하지만 사용은 가능하니 너무 걱정하지마세요 !! 

 

그러면 다음으로 넘어가겠습니다 ! 

 

slice

let str = '012345'
str.slice(start, end);

사용법은 substring와 똑같습니다 !! 

결과값 자체는 substring와 똑같습니다 !!! 

 

 

자 !! 여기서 결과값이 같은데 다 똑같이 써도 되는거 아닌가? 라고 생각이 들겁니다 ! 

사실 두개를 사용함에 있어서 별 다른 차이점이 없습니다 ! 

하지만??? 음수를 사용하는 상황이 온다면 어떻게 할까요?? 즉 ! 뒤에서 문자열을 자르고싶은 경우 ! 

밑에 상황에서 substring를 써야하는지 slice를 써야하는지 비교해보겠습니다 ! 

위에서 보시면 start, end값은 같은데 결과값이 전혀 다른것을 알 수 있습니다 !! 

substring같은 경우는 「Zero-based index number indicating the end of the substring」이런 조건이 있습니다 ! 즉 start의 시작점은 0 부터라는것입니다 !!! 

그래서 음수(-)값을 넣어도 0으로 인식해버려서 위와같은 결과가 나옵니다 !! 

slice는 음수값을 넣으면 맨 오른쪽부터 즉 ! 마지막 문자열부터 숫자를 셉니다 !!! 그래서 저런 결과가 나오는것입니다 !! 

str.substring(-3, 5)
이건 substring(0, 5) 가 되면서 01234가 나오며 ! 

str.slice(-3, 5)
이건 ! 뒤에서 -3번째부터 end가 5번째까지니 34가 나오는것입니다 !

 

참 재밌지 않나요??? 

결론

• subString와 slice의 사용법은 같다 
• 하지만 !!! 뒤에서부터 문자열을 추출하고 싶을 때 ! 음수값을 넣어서 마지막 문자로부터 추출하기의 기능은 slice를 사용해서 추출하는게 편하다 !! 

이상입니다 !