반응형
자바스크립트에서는 문자열을 자르는 방법엔 3가지가 있다.
- slice(start, end)
- substring(start, end)
- substr(start, length)
순서대로 보자
글을 보기 전에 공통적으로 쓰일 예시 하나 보고 가겠다.
예시로 쓸 문장과 각 인덱스 번호다.
1. slice( )
slice( )를 정의하자면
slice( '시작위치', '종료위치') 혹은 slice( '시작위치' )로 사용할 수 있다.
var str = '가나다라마바사';
var result1 = str.slice(1);
//나다라마바사
var result2 = str.slice(4);
//마바사
var reulst3 = str.slice(1, 5);
//나다라마
var result4 = str.slice(-7);
//가나다라마바사
var result5 = str.slice(-5, -2);
//다라마
var result6 = str.slice(-4, 5);
//라마
var result 7 = str.slice(2, -1);
//다라마바
2. substring( )
substring( )은 slice와 비슷하지만 하나의 차이점은 '음수 인덱스를 받지 않는다'
사용법은 비슷하다.
substring( '시작위치', '종료위치') 혹은 substring( '시작위치' )로 사용할 수 있다.
var str = '가나다라마바사'
var result1 = str.substring(2)
//다라마바사
var result2 = str.substring(3, 6)
//라마바
var result3 = str.substring(-3) //str.substring(0)
//가나다라마바사
var result4 = str.substring(-4, 6) //str.substring(0, 6)
//가나다라마바
var result5 = str.substring(2, -3) //str.substring(0, 2)
//가나
사용법은 slice( )와 비슷하다고 했으나 위를 보면 인덱스에 음수를 넣어도 출력이 되는 것을 확인할 수 있다.
하지만 자세히 보면
음수 인덱스를 위치와 상관없이 모두 '0'으로 바꿔서 처리하는 것을 확인할 수 있다.
3. substr( )
substr( )은 위와 방법이 살짝 다르다.
두 번째 변수가 '종료 위치'가 아닌 '길이'라는 것이다.
substr( '시작위치', '길이') 혹은 substr( '시작위치' )로 사용할 수 있다.
var str = '가나다라마바사'
var result1 = str.substr(1)
//나다라마바사
var result2 = str.substr(2, 4)
//다라마바
var result3 = str.substr(3, 4)
//라마바사
var result4 = str.substr(3)
//라마바사
var result5 = str.substr(-2)
//바사
var result6 = str.substr(-5, 4)
//다라마바
substr( ) 은 음수 인덱스가 사용 가능하며, 두 번째 인자는 무조건 '길이'로 해당된다.
var str = '가나다라마바사'
var result1 = str.substr(1, -4)
//결과값 없음
var result2 = str.substr(1, 200)
//나다라마바사
위와 같이 '길이' 위치에 음수가 들어가면 빈 값이 출력되며
아무리 큰 값을 넣어도 해당 문자열의 끝까지 읽는 것을 알 수 있다.
반응형
'Language > web' 카테고리의 다른 글
[JSON][JAVA] content-type: application/json 으로 리턴하기 (0) | 2022.09.06 |
---|---|
[JavaScript] 마스킹 처리하기 (0) | 2022.05.23 |
[CSS] calc() 사용하기 (0) | 2021.12.23 |
[JavaScript] Converting circular structure to JSON 에러 (0) | 2021.12.16 |
[JQuery] jQuery Validation Plugin 사용하기 (0) | 2021.12.14 |
댓글