[JavaScript/jQuery] 문자열 자르기 (몇글자 이상, 날짜의 일부)

웹을 개발하다보면 (웹이 아니여도)

여러모로 문자열 자르기는 거의 매번 하는 작업중 하나죠!

그래서 문자열을 자르는 상황을 대표적인 두가지로 정리해봤습니다!

1

첫번째 문자열을 자르는 경우는 어떤 제목을 몇글자 출력하고 "..." 을 붙혀주고 싶은 경우.

(substr 함수 사용)

if(input.length >= 14){
    return input.substr(0,14)+"...";
}

위는 14글자 이상이면 첫번째 글자부터 14번째 글자까지 자르고 + 연산자로 뒤에 "..." 을 붙혀주는 내용입니다.

좀 더 상세하게 설명 드리자면 자바스크립트의 객체에는 기본적으로 length라는 프로퍼티가 있습니다.

이 프로퍼티는 그 객체가 문자열일 경우 그 문자열의 문자 갯수를 가지고 있습니다.

위 if 문에서는 이 프로퍼티를 이용해서 어떤 문자열 객체의 날짜를 구하고 그 문자열의 길이가 14글자가 넘으면 substr 함수를 활용하여 자른 후 "..." 을 자른 문자열 뒤에 붙혀주는 것입니다.

그리고 그것을 return 하는 것이죠.

2

두번째 문자열을 자르는 경우는 어떤 특정 문자열을 기준을 가지고 나누는 경우가 있을 겁니다.

예를 들어 2015-05-16 이라는 날짜에서 05만 빼오고 싶은 경우.

(split 함수 사용)

var date = input.split(" ")[0];
var tmpDate = date.split("-");
return "~" + tmpDate[1] + "/" + tmpDate[2];

위는 "2016-08-01 00:00:00" 이라는 날짜 스트링(input)이 있다고 했을때 이것을 "~08/01"  이런 형식으로 바꿔서 리턴하는 내용입니다.

이것 또한 조금 더 상세히 설명 드리자면 

자바스크립트 객체의 기본 메서드 중에 split이라는 메서드가 있습니다.

이 메서드는 어떤 문자를 기준으로 문자열을 나눠주는 역할을 합니다.

나눈 문자열은 배열로 반환됩니다. 그래서 위에서 input.split(" ")[0]; 이런 식으로 인덱스를 써서 접근하였죠.

일단 00:00:00 이라는 시분초 정보는 필요 없으니까 공백으로 split 하여 [0] 번째에 들어있는 날짜만 떼어서 var date 에 저장 합니다.

이 date(2016-08-01) 문자열을 -을 기준으로 나눠서 tmpDate에 배열로 저장합니다.

그럼 tmpDate에는 

[0] = 2016

[1] = 08

[2] = 01

이렇게 순서대로 저장될 겁니다.

자바스크립트도 일반적인 언어 처럼 배열 인덱스가 0 부터 시작합니다.

이렇게 나눠진 값을 가지고 "~08/01" 형식의 날짜를 만들 수 있게됩니다!

간단하죠?

자바스크립트에는 유용한 메서드가 많아서 개발하기가 다른 언어보다 매우 수월한 것 같습니다.

물론 저런 메서드는 다른 언어에서도 많이 지원하긴 하지만, 문법자체가 자유롭고 저것 외에도 jQuery로 더 편리한 라이브러리도 많고 웹이 대두되면서 javascript가 쓰이는 곳이 굉장히 많아져서 이번기회에 공부를 많이 해두려고 합니다.

아무튼 꼭 위의 두 상황이 아니여도 저걸 보고 사용법만 이해하셨다면

상황에 맞게 응용해서 쓰시면 될 것 같아요!

모두 열공 열일 하세요!

즐거운 프로그래밍!

도움이 되셨다면 아래 공감 버튼을 꾹!

▼▼▼▼▼▼