자바스크립트 - String타입

 

String 타입

자바스크립트의 String 타입은 텍스트 데이터를 나타내는데 사용한다.

String의 각 요소는 String의 위치를 차지한다. 예를 들어, 첫 번째 요소는 0번 인덱스에 있고, 다음 요소는 1번, 그 다음 요소는 2번... 같은 방식이다. String의 길이는 String이 가지고 있는 요소의 개수이다.

 

문자 길이

배열의 길이를 알아낼 때, 쓰는 속성은 length라는 속성이다. 하지만, 문자인 String형도 length라는 속성으로 길이를 알 수 있다.

회원가입을에서 아이디나 이름이 10자가 넘어갔는지 체크하거나, 핸드폰 번호를 잘 못 입력했을 때 등 자주 사용하는 속성 중 하나이다.

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

 

문자 추출하기

substr() 메서드는 지정된 인덱스에서 시작하여 지정된 수의 문자까지 확장 된 문자열 부분을 반환한다.

// str .substr ( 시작 [, 길이] )
const str = 'Mozilla';

console.log(str.substr(1, 2));
// expected output: "oz"

console.log(str.substr(2));
// expected output: "zilla"

console.log(str.substr(-1, 1));  // 'a'

 

대소문자 바꾸기

String형에서 제공하는 기본 함수들이 많은데 대표적으로 대소문자 변환 함수가 존재한다.

우선,

console.log('python' === 'python'); // true
console.log('Python' === 'python'); // false

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

toUpperCase() 메서드는 모두 대문자로 변환 시켜준다.

반대로, toLowerCase() 메서드는 모두 소문자로 변환시킨다.

const Name = 'Taek Jeoung';
const upperName = Name.toUpperCase();
const lowerName = Name.toLowerCase();
console.log(Name); // Taek Jeoung
console.log(upperName); // TAEK JEOUNG
console.log(lowerName); // taek jeoung

console에서 확인한 것과 같이 Name의 toUpperCase()를 한다고 변수 값이 전부 대문자가 되지 않는다.

 

문자열 찾기

indexOf() 함수는 특정 문자열이 들어있는지 확인하고, 있으면 몇 번 째 순거에 해당 문자열이 있는지 알려준다.

단, 해당 문자열이 없다면 -1을 반환한다.

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

slice()는 이름 그래도 텍스트를 잘라주는 함수이다.

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

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);
console.log(info.slice(0, firstChar)); // JavaScript는
console.log(info.slice(firstChar, info.length)); // 프로그래밍 언어이다.

문구의 첫 번째 값은 0이다.

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

잘릴 끝 위치가 헷갈릴수 있는데, 12번째 문구는 "프"이다.

12번째가 끝 맞는데 해당 문자는 포함하지 않는다. 왜냐하면 바로 그 직전에서 끊어주기 때문이다.

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

info의 16번째인 "언" 이전의 스페이스부터 info의 길이인 22번째까지 자르게 된다.

22번째는 문자가 존재하지 않지만, 그 직전에 끊으니 "."까지 포함하는 문자열로 잘리게 된다.