본문 바로가기
Javascript

JavaScript - String

by Su1993 2020. 6. 21.
반응형

쌍따옴표나, 홀따옴표나 모두 String형 값에 사용한다.

둘 중 어떤 것을 써야 하는지는, 회사 규정에 따라 다르다.

 

let good = '이것도 맞고';
let better = "이것도 맞습니다";

 


1. 대소문자 바꾸기

string형에서 제공하는 기본 함수들이 많은데 대표적으로 알아서 대소문자를 바꿔주는 함수가 있다.

 

let lastName = 'Yeri Kim';
let upperLastName = lastName.toUpperCase();
let lowerLastName = lastName.toLowerCase();
console.log(lastName);
console.log(upperLastName);
console.log(lowerLastName);

 

lastName이라는 변수에 string형의 값을 할당하면 lastName 변수는 string형의 변수가 되는 것이다.

그러면 lastName은 string형이 제공하는 모든 함수를 사용할 수 있다.

toUpperCase와 toLowerCase함수는 string에서 제공하는 함수이다. toUpperCase는 변수에 담긴 문자열을 모두 대문자로 바꿔주는 함수이고 toLowerCase 함수는 변수에 담긴 문자열을 모두 소문자로 바꿔준다.

 


2. 문자 길이

문자인 string형도 length라는 속성으로 길이를 알 수 있다. 주로 회원가입을 받을 때 아이디 값이 10자가 넘어갔는지 체크하거나, 한국의 핸드폰 번호는 무조건 10자 아니면 11자 이므로 잘못 입력했는지 체크할 때 사용한다.

 

if (phoneNumber.length !== 10 &&  phoneNumber.length !== 11) {
  alert("폰번호 제대로 입력하셨나요?");
}

 

⚠️ 주의

핸드폰 번호는 01012345678로 항상 0으로 시작한다. 여기서 문제는 0으로 시작하는 숫자 표현식은 없다.

그래서 핸드폰 번호는 수자로 이루어져 있지만, 문자열로 관리해야 컴퓨터가 첫 숫자인 "0"도 갖고 있게 된다.

 

var phoneNumber = 01012349876;
console.log(phoneNumber);
console.log(phoneNumber.length);

 

이렇게 작성할 경우 phoneNumber는 Number형이며, 앞의 0이 없이 뒷 숫자만 할당된다.

또한 Number형에는 length라는 속성이 존재하지 않는다. 그래서 아래와 같이 string형으로 저장해야 한다.

 

let phoneNumber = "01012349876";
console.log(phoneNumber);
console.log(phoneNumber.length);

 


3. 문자열 찾기

let info = "JavaScript는 프로래밍 언어이다.";

 

위의 코드에 "프로그래밍"이라는 단어가 포함됐는지 알고 싶을 땐,

indexOf() 함수를 사용하면 된다. indexOf() 함수는 특정 문자열이 들어있는지 확인하고, 있으면 몇 번째 순서에 해당 문자열이 있는지 알려준다. 해당 문자열이 없을 경우엔 -1을 반환한다.

이렇게 특정 문자열을 찾는 함수는 주로 댓글 기능에 욕설이 포함되면 달지 못하도록 차단할 때 사용할 수 있다.

차단할 단어 모음이 존재한다고 가정하고, 사용자가 댓글을 달고 "댓글 달기"를 누를 때, 차단할 단어 모음 중에 하나라도 매치되면 댓글을 달지 못하도록 막을 수 있다.

 

let info = "JavaScript는 프로래밍 언어이다.";
let firstChar = info.indexOf("프로래밍"); 
console.log(info, firstChar);


if (firstChar !== -1) { 
  info = info.slice(0, firstChar) + "프로그래밍" + info.slice(firstChar+4, info.length); 
}
console.log(info);

 

프로 래밍이라는 문구가 오타가 나서 "프로그래밍"이라고 바꿔주는 코드이다.

(코드 설명)

1. info 문구에서 "프로 래밍"이 시작되는 index는 12이다.

2. if (firstChar!== -1)

  • firstChar이 -1이 아니면
  • ="프로 래밍"이라는 문구가 없지 않다면
  • ="프로래밍" 이라는 문구가 있다면
  • ="프로래밍" 문구는 12번째에서 시작하므로 firstChar는 12이라는 뜻이다. "프로 래밍"이라는 오타가 포함되어있으면 if문을 실행한다.

3. info.slice(0, firstChar)

slice는 이름 그대로 텍스트를 잘라주는 함수이다.

 

slice(잘릴 시작위치, 잘릴 끝위치)

 

문구의 첫 번째 값은 0이다. 그래서 info문구의 0부터 12번째까지 잘라서 반환한다.

여기서 12번째의 문구는 "프"이다. 12번째가 끝 맞는데 해당 문자는 포함하지 않는다. 바로 그 직전에서 끊어준다.

 

console.log(info.slice(0, firstChar));

 

4. info.slice(firstChar+4, info.length);

info의 16번째인 "언" 이전의 스페이스부터 info의 길이인 22번째까지 자르게 된다. 22번째 문자가 존재하지 않지만, 그 직전에 끊으니 "."까지 포함하는 문자열로 잘리게 된다.

 

console.log(firstChar+4, info.length);

 

반응형

'Javascript' 카테고리의 다른 글

JavaScript - 날짜와 시간  (0) 2020.06.22
JavaScript - String, Number 변환  (0) 2020.06.22
JavaScript - 데이터 타입  (0) 2020.06.21
JavaScript - 배열 조작하기  (0) 2020.06.21
JavaScript - for문  (0) 2020.06.21

댓글