[자료형 심화] 07. 문자열 심화

숫자 값을 객체처럼 다룰 수 있듯이 JavaScript에서는 문자열도 객체처럼 다룰 수가 있습니다.

문자열은 배열과 비슷한 부분이 많습니다.

// String
let myString = 'Hi Codeit';

// 부분 문자열 접근 slice(start, end)
console.log(myString.slice(0,2));
console.log(myString.slice(3));
console.log(myString.slice());

// 양 쪽 공백 제거
console.log(myString.trim()); // trim 메소드

// 대소문자 변환
console.log(myString.toUpperCase()); // 대문자 // HI CODEIT
console.log(myString.toLowerCase()); // 소문자 // hi codeit

// 요소 탐색
console.log(myString.indexOf('i')); // 앞 부터 // 1
console.log(myString.lastIndexOf('i')); // 뒤 부터 // 7

// 요소 접근
console.log(myString[3]); // 대괄호 표기법 // C
console.log(myString.charAt(3)); // charAt 메소드 // C

// 문자열 길이
console.log(myString.length); // length 프로퍼티 // 9

먼저 length 프로퍼티입니다. 배열에서도 봤듯이 length 프로퍼티는 이 문자열의 길이를 알려주는 역할을 합니다.

저장하고 실행해보면 공백을 포함해서 'Hi Codeit'이라는 글자 수에 맞게 9라는 값이 출력됩니다.

 

그리고 문자열도 글자 하나하나에 접근을 할 수가 있습니다.

배열에서 사용하는 대괄호 표기법과 인덱스를 통해서 접근할 수도 있고 문자열은 특별히 charAt이라는 메소드를 활용해서 접근할 수도 있습니다. 저장하고 실행해보면 3번 인덱스에 있는 대문자 C를 가져오는 것을 확인할 수 있습니다. 

 

또 배열에서 활용할 수 있는 indexOf와 lastIndexOf를 활용해서 요소를 찾을 수도 있습니다. 저장하고 실행해보면 i가 앞에서부터 찾을 때는 1번 인덱스에, 뒤에서부터 찾을 때는 7번 인덱스에 있죠. 그래서 결과값이 1과 7이 나오는 걸 확인할 수 있습니다. 만약에 알파벳 a처럼 문자열에 없는 문자열을 찾으려고 하면 -1이 출력됩니다.

 

그다음은 대문자 소문자 변환 메소드입니다. toUpperCase와 toLowerCase입니다.

저장하고 실행해보면 대소문자가 섞여있는 문자열을 모두 대문자로 혹은 소문자로 바꿔주는 모습을 확인할 수 있습니다.

 

그리고 또 독특하게 문자열에는 양 끝에 공백을 제거해 주는 trim이라는 메소드가 있습니다. 

양쪽 끝에 공백을 넣어 준 다음 실행을 시켜보면 다른 메소드들은 양쪽 공백을 모두 포함한 상태로 메소드가 실행이 되는데 trim의 경우에는 양쪽 공백을 제거한 문자열을 이렇게 리턴해줍니다. 

 

마지막으로 살펴볼 메소드는 slice라는 메소드인데요.

앞에서 이 요소를 접근하는 문자열 하나만 가져오는 방법을 배웠었다면 slice는 부분 문자열을 가지고 오는 메소드입니다.

slice는 두 개의 파라미터를 가지고 있는데, 시작과 끝 인덱스입니다.

한 가지 주의해야 될 부분은 끝 인덱스 바로 직전까지의 범위를 가져온다는 것입니다.

파라미터 두 개(0,2)를 전달하면 0번 인덱스부터 2번 인덱스 직전까지 즉, 0번부터 1번 인덱스까지 문자열을 리턴해줍니다.

그리고 배열에서 배웠던 splice와 마찬가지로 두 번째 파라미터를 생략하게 되면 시작 지점부터 끝까지 문자열을 리턴하고 모두 다 생략했을 경우에는 그냥 문자열 전체를 가지고 옵니다.