..

Search

39) String 메소드

39) String 메소드

String 메소드


String 메소드

String 메소드는 String 객체에 정의된 문자열과 관련된 작업을 할 때 사용하는 메소드입니다.

 

1. String.fromCharCode()

2. String.fromCodePoint()


String.fromCharCode() 메소드

이 메소드는 쉼표로 구분되는 일련의 유니코드에 해당하는 문자들로 구성된 문자열을 반환합니다.

예제

String.fromCharCode(65, 66, 67); // "ABC"


String.fromCodePoint() 메소드

이 메소드는 쉼표로 구분되는 일련의 코드 포인트(code point)에 해당하는 문자들로 구성된 문자열을 반환합니다.

예제

String.fromCodePoint(65, 66, 67); // "ABC"

String.fromCodePoint(0x2F804);    // "\uD87E\uDC04"

String.fromCodePoint(194564);     // "\uD87E\uDC04"

 

String.fromCodePoint() 메소드는 사파리, 익스플로러에서 지원하지 않습니다.


자바스크립트 String 메소드

메소드 설명

String.fromCharCode()

쉼표로 구분되는 일련의 유니코드에 해당하는 문자들로 구성된 문자열을 반환함.

String.fromCodePoint()

쉼표로 구분되는 일련의 코드 포인트(code point)에 해당하는 문자들로 구성된 문자열을 반환함.

String.raw()

템플릿 문자열(template string)의 원형을 반환함.

String.prototype 메소드

모든 String 인스턴스는 String.prototype으로부터 메소드와 프로퍼티를 상속받습니다.

이렇게 상속받은 String.prototype 메소드를 이용하면, 다음과 같은 문자열 작업을 할 수 있습니다.

 

1. 문자열에서의 위치 반환

2. 문자열에서 지정된 위치에 있는 문자 반환

3. 문자열 추출

4. 문자열 분리

5. 문자열 결합

6. 문자열의 대소문자 변환

7. 문자열 주위의 공백 제거

8. 정규 표현식을 이용한 문자열 조작

 

String 인스턴스의 값은 변경될 수(immutable) 없으므로, 모든 String 메소드는 결괏값으로 새로운 문자열을 생성하여 반환합니다.

문자열에서의 위치 찾기

다음 메소드는 String 인스턴스에서 특정 문자나 문자열이 처음으로 등장하는 위치나 마지막으로 등장하는 위치를 반환합니다.

 

- indexOf()

- lastIndexOf()

 

이 메소드들은 문자열을 찾기 시작할 String 인스턴스의 위치를 두 번째 인수로 전달할 수 있습니다.

만약 전달받은 특정 문자나 문자열을 찾을 수 없을 때는 -1을 반환합니다.

 

예제

var str = "abcDEFabc";

str.indexOf('abc');     // 0  -> 자바스크립트에서 인덱스는 0부터 시작함.

str.indexOf('abcd');    // -1 -> 문자열을 비교할 때 문자의 대소문자를 구분함.

str.indexOf('abc', 3);  // 6  -> 인덱스 3부터 'abc'를 찾기 시작함.

str.lastIndexOf('abc'); // 6

str.lastIndexOf('d');   // -1

str.lastIndexOf('c');   // 8

코딩연습 ▶


문자열에서 지정된 위치에 있는 문자 반환

다음 메소드는 String 인스턴스에서 전달받은 인덱스에 위치한 문자나 문자 코드를 반환합니다.

 

- charAt()

- charCodeAt()

- charPointAt()

 

예제

var str = "abcDEFabc";

str.charAt(0);      // a

str.charAt(10);     // 빈 문자열 -> 전달받은 인덱스가 문자열의 길이보다 클 경우에는 빈 문자열을 반환함.

str.charCodeAt(0);  // 97        -> 'a'에 해당하는 UTF-16 코드를 반환함.

str.codePointAt(0); // 97        -> 'a'에 해당하는 유니코드 코드 포인트를 반환함.

코딩연습 ▶

 

codePointAt() 메소드는 사파리, 익스플로러에서 지원하지 않습니다.

문자열 추출

다음 메소드는 String 인스턴스에서 전달받은 시작 인덱스부터 종료 인덱스 바로 앞까지의 문자열만을 추출하여 만든 새로운 문자열을 반환합니다.

 

- slice()

- substring()

- substr()

 

예제

var str = "abcDEFabc";

str.slice(2, 6);     // cDEF     -> 인덱스 2부터 인덱스 5까지의 문자열을 추출함.

str.slice(-4, -2);   // Fa       -> 음수로 전달된 인덱스는 문자열의 뒤에서부터 시작함.

str.slice(2);        // abcDEFab -> 인수로 종료 인덱스가 전달되지 않으면 문자열의 마지막까지 추출함.

str.substring(2, 6); // cDEF

str.substr(2, 4);    // cDEF

코딩연습 ▶


문자열 분리

다음 메소드는 String 인스턴스를 구분자(separator)를 기준으로 나눈 후, 나뉜 문자열을 하나의 배열로 반환합니다.

 

- split()

 

split() 메소드는 인수로 구분자를 전달하지 않으면, 전체 문자열을 하나의 배열 요소로 가지는 길이가 1인 배열을 반환합니다.

 

예제

var str = "자바스크립트는 너무 멋져요! 그리고 유용해요.";

str.split();    // 구분자를 명시하지 않으면 아무런 동작도 하지 않음.

str.split("");  // 한 문자("")씩 나눔.

str.split(" "); // 띄어쓰기(" ")를 기준으로 나눔.

str.split("!"); // 느낌표("!")를 기준으로 나눔.

코딩연습 ▶


문자열 결합

다음 메소드는 String 인스턴스에 전달받은 문자열을 결합한 새로운 문자열을 반환합니다.

 

- concat()

 

예제

var str = "자바스크립트";

str;                                                // 자바스크립트

str.concat("는 너무 멋져요!");                      // 자바스크립트는 너무 멋져요!

str.concat("는 너무 멋져요!", " 그리고 유용해요."); // 자바스크립트는 너무 멋져요! 그리고 유용해요!

str;                                                // 자바스크립트

코딩연습 ▶

 

위의 예제에서 여러 번 concat() 메소드를 실행한 후의 변수 str의 문자열은 여전히 처음과 같습니다.

이처럼 자바스크립트에서 String 인스턴스의 값은 변경될 수(immutable) 없습니다.

따라서 모든 String 메소드는 결괏값으로 새로운 문자열을 생성하여 반환합니다.


문자열의 대소문자 변환

다음 메소드는 String 인스턴스의 모든 문자를 대문자나 소문자로 변환한 새로운 문자열을 반환합니다.

 

- toUpperCase()

- toLowerCase()

 

예제

var str = "JavaScript";

str.toUpperCase(); // JAVASCRIPT

str.toLowerCase(); // javascript

코딩연습 ▶


문자열 주위의 공백 제거

다음 메소드는 String 인스턴스의 양 끝에 존재하는 모든 공백과 줄 바꿈 문자(LF, CR 등)를 제거한 새로운 문자열을 반환합니다.

 

- trim()

 

trim() 메소드는 String 인스턴스의 문자열 값 그 자체에는 영향을 주지 않습니다.

 

예제

 

var str = "      JavaScript    ";

str.trim();

 

코딩연습 ▶


정규 표현식을 이용한 문자열 조작

다음 메소드는 인수로 전달받은 정규 표현식을 이용하여, String 인스턴스 값에서 검색, 대조, 대체 등의 작업을 수행합니다.

 

- search()

- match()

- replace()

 

정규 표현식에 대한 더 자세한 사항은 자바스크립트 정규 표현식 수업에서 확인할 수 있습니다.

 

자바스크립트 정규 표현식 수업 확인 =>


자바스크립트 String.prototype 메소드

메소드 설명

indexOf()

String 인스턴스에서 특정 문자나 문자열이 처음으로 등장하는 위치의 인덱스를 반환함.

lastIndexOf()

String 인스턴스에서 특정 문자나 문자열이 마지막으로 등장하는 위치의 인덱스를 반환함.

charAt()

String 인스턴스에서 전달받은 인덱스에 위치한 문자를 반환함.

charCodeAt()

String 인스턴스에서 전달받은 인덱스에 위치한 문자의 UTF-16 코드를 반환함. (0 ~ 65535)

charPointAt()

String 인스턴스에서 전달받은 인덱스에 위치한 문자의 유니코드 코드 포인트(unicode code point)를 반환함.
slice() String 인스턴스에서 전달받은 시작 인덱스부터 종료 인덱스 바로 앞까지의 문자열을 추출한 새 문자열을 반환함.
substring() String 인스턴스에서 전달받은 시작 인덱스부터 종료 인덱스 바로 앞까지의 문자열을 추출한 새 문자열을 반환함.
substr() String 인스턴스에서 전달받은 시작 인덱스부터 길이만큼의 문자열을 추출한 새로운 문자열을 반환함.
split() String 인스턴스에서 구분자(separator)를 기준으로 나눈 후, 나뉜 문자열을 하나의 배열로 반환함.
concat() String 인스턴스에 전달받은 문자열을 결합한 새로운 문자열을 반환함.
toUpperCase() String 인스턴스의 모든 문자를 대문자로 변환한 새로운 문자열을 반환함.
toLowerCase() String 인스턴스의 모든 문자를 소문자로 변환한 새로운 문자열을 반환함.
trim() String 인스턴스의 양 끝에 존재하는 공백과 모든 줄 바꿈 문자(LF, CR 등)를 제거한 새로운 문자열을 반환함.
search() 인수로 전달받은 정규 표현식에 맞는 문자나 문자열이 처음으로 등장하는 위치의 인덱스를 반환함.
replace() 인수로 전달받은 패턴에 맞는 문자열을 대체 문자열로 변환한 새 문자열을 반환함.
match() 인수로 전달받은 정규 표현식에 맞는 문자열을 찾아서 하나의 배열로 반환함.
includes() 인수로 전달받은 문자나 문자열이 포함되어 있는지를 검사한 후 그 결과를 불리언 값으로 반환함.
startsWith() 인수로 전달받은 문자나 문자열로 시작되는지를 검사한 후 그 결과를 불리언 값으로 반환함.
endsWith() 인수로 전달받은 문자나 문자열로 끝나는지를 검사한 후 그 결과를 불리언 값으로 반환함.
toLocaleUpperCase() 영문자뿐만 아니라 모든 언어의 문자를 대문자로 변환한 새로운 문자열을 반환함.
toLocaleLowerCase() 영문자뿐만 아니라 모든 언어의 문자를 소문자로 변환한 새로운 문자열을 반환함.
localeCompare() 인수로 전달받은 문자열과 정렬 순서로 비교하여 그 결과를 정수 값으로 반환함.
normalize() 해당 문자열의 유니코드 표준화 양식(Unicode Normalization Form)을 반환함.
repeat() 해당 문자열을 인수로 전달받은 횟수만큼 반복하여 결합한 새로운 문자열을 반환함.
toString() String 인스턴스의 값을 문자열로 반환함.
valueOf() String 인스턴스의 값을 문자열로 반환함.

연습문제