자바스크립트 03 문자열 메서드 .slice() 와 .substring()의 차이

1. 현재의 무드: 코드스테이츠 Day 5! 오늘은 페어도 없고 날씨가 사알짝 우중충에서 조금 처지는 중... 이지만! 힘내서 연습문제를 복습하고 있다. 내가 쓴 코드와 레퍼런스 코드를 비교하면서 더 간결하고 가독성 좋은 코드를 짜려면 어떤 부분들을 신경써야 할지 인사이트를 왕창 얻는 중!

 

2. 오늘 학습한 내용 중 키워드: .slice() .substring()

 

3. 오늘 학습한 내용 요약: 

string.slice(start, stop);
string.substring(start,stop);

이 둘은 공통첨과 차이점을 모두 가지고 있다.

 

먼저, 공통점은

let str = 'javababo'
str.slice(1,1) === str.substring(1,1) // '' / start === stop 일 경우, 빈 문자열을 반환한다.
str,slice(1,) === str.substring(1,) // 'avababo'/ stop이 누락될 경우, 문자열을 start 부터 끝까지 반환한다. 
str.slice(1,15) === str.substring(1,15) // 'avababo' / 두 인자 중 한 인자가 str.length 보다 클 경우, str.length 가 그 인자를 대신한다.

 

그러나, 다른 점으로는

//substring만의 특징

str.substring(5,2) // 'vab' / start > stop 인 경우, 두 수를 swap 하여 보여줌
str.slice (5,2) // '' 

str.substring(NaN,2) // 'ja'
str.substring(-1,2) // 'ja'
// NaN이나 음수가 들어갔을 경우, 0으로 취급하여 보여줌

 

//slice()만의 특징

str.slice(-2,8) // 'bo' / start가 음수일 때, sets char from the end of string
str.slice(-2,7) // 'b'
str.slice(-2,6) // ''

str.slice(1,-1) // 'avabab' /stop이 음수일 때, sets stop at (str.length-1)-Math.abs(stop)

 

아마... 숫자가 잘못 들어가면 엄격하게 돌아가지 않거나, start와 stop 순서를 의도적으로 맞추어 써줘야 하는 경우는 slice 를 쓰고,

알아서 flexible하게 맞춰주는 것이 필요할 때에는 substring을 쓰면 될듯?

 

 

https://stackoverflow.com/questions/2243824/what-is-the-difference-between-string-slice-and-string-substring

What is the difference between String.slice and String.substring?

 

이 글을 참고했는데, 댓글들을 보니

 

"이건 자바스크립트가 구리게 설계되었다는 걸 보여주는 예시야. 우리는 결국 다 똑같은 기능을 하는걸 세가지 다른 메서드를 갖고 있는거지. 하지만 각각 다른 단점을 곁들인ㅋ 내 생각엔 slice가 가장 예측 불가능한 행동을 덜 하는듯" 

 

이라는 댓글 있길래 웃겼음