JS - 문자열 다루기

문자열에 관한 메서드를 설명합니다. 검색 관련 메서드는 다음 표를 이용할 수 있습니다.

메서드	설 명
charAt()	주어진 인덱스가 가리키는 문자를 반환 Ex.) "ABC"charAt(0); // A 를 반환
charCodeAt()	주어진 인덱스가 가리키는 문자의 아스키 코드 값으로 반환 Ex.) "ABC".charCodeAt(1); // 66 으로 변환
fromCharCode()	아스키 코드 값을 문자로 변환 Ex.) String.fromCharCode(65); // A 로 변환
escape()	문자열을 아스키 코드 값으로 변환
unescape()	아스키 코드 값을 문자열로 변환
replace(str, new);	str 과 일치하는 문자를 new 로 치환한 문자열을 반환 단, 처음으로 찾은 문자만 치환하고 이후는 치환안함.
slice()	지정한 a 지점과 b 지점 사이의 문자열을 추출하여 반환. 음수이면 문자열 끝에서 시작 Ex.) "ABC".slice( a 지점, b 지점 )
substring()	음수를 0 부터 시작한다는 점을 제외하면 slice() 와 동일
substr()	지정한 길이만큼 문자열의 일부(또는 전체)를 추출하여 반환 음수이면 문자열 끝에서 시작 Ex.) "ABC".substr(시작 인덱스, 길이);
concat()	두 문자를 하나로 합침 Ex.) "ABC".concat("DE"); // ABCDE
split()	문자열을 구분자로 나누어 배열로 만듬 Ex.) "A,B,C".split(나눌 구분자);
trim()	문자열의 앞과 뒤 공백을 제거 ltrim(): 왼쪽 공백을 제거 rtrim(): 오른쪽 공백을 제거
indexOf()	찾는 값이 해당 문자열의 처음으로 나오는 위치를 인덱스로 반환 Ex.1) indexOf(찾는 문자열); Ex.2) indexOf(찾는 문자열, 시작 인덱스);
lastIndexOf()	찾는 값이 해당 문자열의 마지막으로 나오는 위치를 인덱스로 반환 Ex.1) lastIndexOf(찾는 문자열); Ex.2) lastIndexOf(찾는 문자열, 시작 인덱스);
encodeURI()	영문, 숫자, 그리고 : ; / = ? & 등을 제외한 문자열을 인코딩 Ex.) var str = encodeURI("문자열");
encodeURIComponent()	-_.을 제외한 모든 영숫자가 아닌 문자를 퍼센트(%) 사인에 이어지는 두 16진수로 인코딩 Ex.) var str = encodeURIComponent("문자열");
decodeURI()	encodeURI() 로 인코딩한 문자열을 디코딩
decodeURIComponent()	encodeURIComponent()로 인코딩한 문자열을 디코딩

charAt(), charCodeAt(), fromCharCode()

<script>
// 0 은 첫 번째를 뜻하므로 A 문자를 반환
document.write( "ABC".charAt(0) + "<br/>");
// A

// 아스키 코드 65 는 A 이므로 A 를 반환
document.write( String.fromCharCode(65) + "<br/>");
// A

// 1 은 두 번째를 말하므로 B 의 아스키 코드 값 66을 반환
document.write( "ABC".charCodeAt(1) + "<br/>");
// 66
</script>

replace(str, new)

찾는 문자가 있으면 새로운 문자로 치환한 문자열을 반환하며, 만약, 일치하는 문자가 여러 개이면 처음으로 찾은 문자만 치환하고 이후 문자는 치환하지 않습니다.

모든 문자를 치환하려면 정규 표현식을 이용해야 합니다.

<script>
// 문자 치환 예
// "하보니"를 Hello 로 치환 
document.write( "하보니-PHP-하보니".replace("하보니", "Hello") + "<br/>");
// Hello-PHP-하보니


// 찾은 문자 전체를 치환하기 위해 
// 정규표현식을 이용합니다.
document.write( "하보니-PHP-하보니".replace(/하보니/gim, "Hello") + "<br/>");
// Hello-PHP-Hello
</script>

slice(a, b)

a 지점부터 b 지점 사이의 문자를 추출하는데, b 지점은 0 부터 시작하는 인덱스입니다. 형식은 다음과 같습니다.

str.slice( a, b )

음수이면 끝에서 시작합니다.

<script>
// 2 번째 부터 나머지 문자열을 추출
document.write( "하보니-PHP".slice(1) + "<br/>");
// 보니-PHP

// 뒤에서 3문자를 추출
document.write( "하보니-PHP".slice(-3) + "<br/>");
// PHP

// a 지점: 뒤에서 부터 3 지점인 문자부터
// b 지점: 뒤에서 부터 1 지점 사이의 문자는 "PH"
document.write( "하보니-PHP".slice(-3, -1) + "<br/>");
// PH

// a 지점: 0 부터 1 지점인 문자부터
// b 지점: 0 부터 3 지점 사이의 문자는 "보니"
document.write( "하보니-PHP".slice(1, 3) + "<br/>");
// 보니

// a 지점: 0 부터 1 지점인 문자부터
// b 지점: 0 부터 5 지점 사이의 문자는 "ello"
document.write( "Hello-PHP-Hello".slice(1, 5) + "<br/>");
// ello
</script>

substring(a, b)

a 지점부터 b 지점 사이의 문자를 추출하는데, b 지점은 0 부터 시작하는 인덱스입니다. 형식은 다음과 같습니다.

str.substring( a, b )

음수이면 0을 가리킵니다.

<script>
// 두 번째부터 나머지 문자열을 추출
document.write( "하보니-PHP".substring(1) + "<br/>");
// 보니-PHP

// 음수는 0 을 가리키므로 0 과 2 사이의 문자...
// a 지점: 0 지점인 문자부터
// b 지점: 0 부터 2 지점 사이의 문자는 "하보"
document.write( "하보니-PHP".substring(-3, 2) + "<br/>");
// 하보

// a 지점: 0 부터 1 지점인 문자부터
// b 지점: 0 부터 3 지점 사이의 문자는 "보니"
document.write( "하보니-PHP".substring(1, 3) + "<br/>");
// 보니

// a 지점: 0 부터 1 지점인 문자부터
// b 지점: 0 부터 5 지점 사이의 문자는 "ello"
document.write( "Hello-PHP-Hello".substring(1, 5) + "<br/>");
// ello
</script>

substr(a, b)

a 지점부터 지정한 길이만큼 추출하여 반환합니다. slice() 와 substring() 에서의 b 지점은 0 부터 시작하는 반면 substr() 은 a 지점부터 시작합니다.

str.substr( a, b )

음수이면 끝에서 시작합니다.

<script>
// 4 번째 부터 2 문자을 추출
document.write( "하보니-PHP".substr(3, 2) + "<br/>");
// -P

// 2 번째 부터 나머지 문자열을 추출
document.write( "하보니-PHP".substr(1) + "<br/>");
// 보니-PHP

// 뒤에서 3 문자를 추출
document.write( "하보니-PHP".substr(-3) + "<br/>");
// PHP

// 2 번째 부터 4 문자를 추출
document.write( "하보니-PHP".substr(1, 4) + "<br/>");
// 보니-P
</script>

concat, split

문자열을 배열로 만들거나 두 문자열을 하나로 합칠 수 있습니다.

<script>
// 두 문자열을 합칩니다.
document.write( "ABC".concat("DE") + "<br/>");
// ABCDE


// 구분자를 기준으로 문자열을 배열로 만듭니다.
document.write( "ABC".split("") + "<br/>");
// A, B, C

document.write( "A-B-C".split("-") + "<br/>");
// A, B, C
</script>