JavaScript charAt() 메서드 완벽 정리 – 문자열에서 특정 인덱스의 문자 추출하기

charAt() 메서드란?

JavaScript의 charAt() 메서드는 문자열에서 지정한 인덱스(위치)에 해당하는 문자를 반환하는 메서드입니다. 하나의 매개변수(인덱스)를 받아, 그 위치에 있는 문자를 찾아 결과로 돌려줍니다.

문법(Syntax)

string.charAt(index);

인덱스는 0부터 시작합니다. 만약 문자열 길이를 벗어난 인덱스를 전달하면 빈 문자열("")이 반환되며, 매개변수를 생략할 경우 기본값인 0이 적용됩니다.

예제 1

다음 예제에서는 charAt() 메서드에 인덱스 9를 전달하여, 해당 위치의 문자를 화면에 출력합니다.

<html>
<body>
<p id="character"></p>
<script>
    var string = "TUTORIALSPOINT AND TUTORIX";
    var result = string.charAt(9)
    document.getElementById("character").innerHTML = result;
</script>
</body>
</html>

출력 결과

문자열 "TUTORIALSPOINT AND TUTORIX"에서 인덱스 9에 해당하는 문자는 'P'이므로 위와 같은 결과가 출력됩니다.

예제 2

다음 예제에서는 인덱스 11을 매개변수로 전달하며, charAt() 메서드는 해당 위치의 문자 'a'를 결과로 반환합니다.

<html>
<body>
<script>
    var string = "Tutorix is a best e-learning platform";
    var result = string.charAt(11)
    document.write(result);
</script>
</body>
</html>

출력 결과

참고: 대괄호 표기법과의 차이

문자열에서 특정 문자를 가져올 때는 str[index] 형태의 대괄호 표기법도 사용할 수 있습니다. 다만 두 방식에는 차이가 있습니다. 존재하지 않는 인덱스를 조회할 경우 charAt()은 빈 문자열("")을 반환하는 반면, 대괄호 표기법은 undefined를 반환합니다. 따라서 안전하게 문자를 처리해야 하는 상황에서는 charAt() 사용이 권장됩니다.