String 도 원시 타입이기 때문에 String 래퍼 객체를 생성한다. String 래퍼 객체는 length 프로퍼티와 인덱스를 가지므로 유사 배열 객체다.
'Hello'.length; // -> 5
'안녕하세요!'.length; // -> 6
String 메서드
문자열은 변경 불가능한 원시 값이기 때문에 String 래퍼 객체도 읽기 전용 객체로 제공된다. String 메서드는 언제나 새롱운 문자열을 반환한다.
String.prototype.indexOf
인수로 전달받은 문자열에서 대상 문자열이 위치한 인덱스를 반환한다. 검색에 실패하면 -1을 반환한다.
const str = 'Hello World';
// 문자열 str에서 'l'을 검색하여 첫 번째 인덱스를 반환한다.
str.indexOf('l'); // -> 2
// 문자열 str에서 'or'을 검색하여 첫 번째 인덱스를 반환한다.
str.indexOf('or'); // -> 7
// 문자열 str에서 'x'를 검색하여 첫 번째 인덱스를 반환한다. 검색에 실패하면 -1을 반환한다.
str.indexOf('x'); // -> -1
String.prototype.search
인수로 전달받은 정규표현식과 매치하는 대상 문자열을 검색해서 대상 문자열이 위치한 인덱스를 반환한다. 검색에 실패하면 -1을 반환한다.
const str = 'Hello world';
// 문자열 str에서 정규 표현식과 매치하는 문자열을 검색하여 일치하는 문자열의 인덱스를 반환한다.
str.search(/o/); // -> 4
str.search(/x/); // -> -1
String.prototype.charAt
대상 문자열에서 인수로 전달받은 인덱스에 해당하는 문자를 반환한다. 대상 문자열의 범위를 벗어난 인덱스인 경우 빈 문자열을 반환한다.
const str = 'Hello';
for (let i = 0; i < str.length; i++) {
console.log(str.charAt(i)); // H e l l o
}
// 인덱스가 문자열의 범위(0 ~ str.length-1)를 벗어난 경우 빈문자열을 반환한다.
str.charAt(5); // -> ''
String.prototype.substring
대상 문자열에서 첫번째 인수의 인덱스에 위치한 문자부터 두번째 인수의 인덱스에 위치한 문자 바로 이전까지의 부분 문자열을 반환한다. 단, 마이너스 인수의 경우 0으로 취급된다.
const str = 'Hello World';
// 인덱스 1부터 인덱스 4 이전까지의 부분 문자열을 반환한다.
str.substring(1, 4); // -> ell
// 첫 번째 인수 > 두 번째 인수인 경우 두 인수는 교환된다.
str.substring(4, 1); // -> 'ell'
// 인수 < 0 또는 NaN인 경우 0으로 취급된다. ****
str.substring(-2); // -> 'Hello World'
String.prototype.slice
substring 메서드와 동일하게 동작한다. 단, 음수인 인수를 전달할 수 있다.
const str = 'hello world';
// substring과 slice 메서드는 동일하게 동작한다.
// 0번째부터 5번째 이전 문자까지 잘라내어 반환
str.substring(0, 5); // -> 'hello'
str.slice(0, 5); // -> 'hello'
// 인덱스가 2인 문자부터 마지막 문자까지 잘라내어 반환
str.substring(2); // -> 'llo world'
str.slice(2); // -> 'llo world'
// 인수 < 0 또는 NaN인 경우 0으로 취급된다. ****
str.substring(-5); // -> 'hello world'
// slice 메서드는 음수인 인수를 전달할 수 있다. 뒤에서 5자리를 잘라내어 반환한다.
str.slice(-5); // ⟶ 'world'
'Today I Learned' 카테고리의 다른 글
모던 자바스크립트 Deep Dive 34장~36장 이러터블/스프레드 문법/디스트럭처링 할당 (0) | 2022.05.09 |
---|---|
모던 자바스크립트 Deep Dive 33장 Symbol (0) | 2022.05.09 |
모던 자바스크립트 Deep Dive 31장 RegExp (0) | 2022.04.19 |
모던 자바스크립트 Deep Dive 30장 Date (0) | 2022.04.19 |
모던 자바스크립트 Deep Dive 29장 Math (0) | 2022.04.19 |