JS - String

JavaScript

목록 보기
2/4
post-thumbnail

대소문자 바꾸기

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

👉 String 함수들 참고

console.log('js' === 'js'); // true
console.log('Js' === 'js'); // false
console.log('js' === 'js'); // true
console.log('Js' === 'js'); // false

결과에서 보듯이 String의 대소문자가 구분됩니다.

웹사이트에 검색기능이 있는 경우 Js 라고 검색 했을 때, J 가 정확히 대문자인 것만 찾아주는 것이 아니라, 대소문자 구분 없이 js 라는 단어가 포함된 모든 컨텐츠를 찾고 싶을 수가 있습니다.

아래와 같이 임의의 String을 작성하고 toUpperCase 와 toLowerCase 메소드를 호출하여 반환되는 값을 확인해 봅시다.

let lastName = 'Boyoon Kim'
let upperLastName = lastName.toUpperCase();
let lowerLastName = lastName.toLowerCase();

console.log(lastName); //Boyoon Kim
console.log(upperLastName); //BOYOON KIM
console.log(lowerLastName); //boyoon kim

lastName 이라는 변수에 String형의 값을 할당하면, lastName 변수는 String형의 변수가 됩니다.

그러면 lastName 은 String형이 제공하는 모든 메소드를 사용할 수 있게 됩니다.

toUpperCase 와 toLowerCase 함수는 String에서 제공하는 메소드 입니다.

그리고 console 에서 확인한 것과 같이, lastName 에 toUpperCase 함수를 사용한다고 lastName 변수

의 값 자체가 바뀌지는 않았습니다.

lastName 는 이전 값을 그대로 갖고 있습니다.

(이 문장이 이해 되려면 코드를 직접 작성해보셔야 합니다!)

문자 길이

문자인 String형도 length 라는 속성으로 길이를 알 수 있습니다.

length 는 자주 사용하는 속성 중 하나 입니다.

회원가입을 받을 때 이름에 10자가 넘어갔는지 체크하거나, 한국의 핸드폰 번호는 무조건 10자 아니면 11자 이므로, 사용자가 값을 잘못 입력했는지 체크할 때 유용하게 사용합니다.

다음 예제는 핸드폰 번호(phoneNumber)가 10자리도 아니고, 11자리도 아니면 alert 를 보여줍니다.

let phoneNumber = 01012345678
if (phoneNumber.length !== 10 && phoneNumber.length !==11){
  alert("폰 번호 맞니?")
} //폰 번호 맞니?

console.log(phoneNumber); // 1012345678
console.log(phoneNumber.length); // undefined

이와 같이 phoneNumber 는 Number형이며, 앞의 0이 없이 뒷 숫자만 할당되었습니다.

또한, Number형에는 length 라는 속성이 존재하지 않습니다.

그렇기 때문에, 핸드폰 번호를 온전히 표시하고 length 속성을 이용하려면

아래와 같이 String형으로 저장해야합니다.

let phoneNum = "01012345678"
if (phoneNum.length == 10 || phoneNum.length ==11){
  alert("잘했다")
} // 잘했다

console.log(phoneNum); // 01012345678
console.log(phoneNum.length); // 11
profile
어제보다 오늘 더 성장하는 프론트엔드 개발자

0개의 댓글