[JavaScript] 문자열 메서드 정리

문자열 메서드가 작동하는 이유

문자열은 기본적으로 원시타입이기 때문에 직접 수정, 변경이 불가능하다. 이런 문자열에 문자열 메서드가 작동할 수 있는 이유는, 메서드가 호출될 때 자바스크립트가 이 원시타입 문자열을 문자열 객체로 변환하기 때문이다. 그리고 메서드는 해당 문자열 객체에 대하여 실행된다. 그리고 이 과정을 (원시 값을 객체로 변환하는 것을) 'boxing' 이라고 한다. 

String.prototype.indexOf()

• 호출한 Str 에서 주어진 값과 일치하는 첫 번째 인덱스를 리턴한다.
• 일치하는 값이 없을 시 -1 을 리턴한다.

const str = 'What a beautiful day!';

str.indexOf('a'); // 2
str.indexOf('x'); // -1
str.indexOf('beautiful'); // 7

// lastIndexOf() 뒤에서 부터 검색하여 결과값을 리턴한다.
str.lastIndexOf('a'); //18

String.prototype.includes()

• 하나의 문자열이 다른 문자열에 포함되어 있는지를 판별하고, 결과를 boolean 으로 리턴한다.

const str = 'What a beautiful day!';

str.includes('beautiful'); // true
str.includes('coding'); // false

String.prototype.split()

• 문자열을 지정 구분자를 이용해 여러개의 문자열로 나눈 배열을 리턴한다. 

const str = 'What a beautiful day!';

str.split(' '); // 공백으로 구분
// ['What', 'a', 'beautiful', 'day!']

str.split('a');
// ['Wh', 't ', ' be', 'utiful d', 'y!']

String.prototype.substring()

• 문자열의 시작 인덱스부터 종료 인덱스 직전 까지의 부분 문자열을 리턴한다.

const str = 'JavaScript';

str.substring(1, 4); // 'ava'
str.substring(4); // 'Script'

 

String.prototype.slice()

• 문자열의 일부를 추출하면서 새로운 문자열을 리턴한다. 

const str = 'coding';

str.slice(-2); // 'ng' index에 음수 값을 넘겨주면 문자열의 뒷부분부터 검색한다.
str.slice(2,6) // 'ding'

String.prototype.trim()

• 문자열 양 끝의 공백을 제거한 후, 새 문자열로 리턴한다.
• 한 쪽의 공백만 제거하려면 trimStart() 혹은 trimEnd()를 사용한다.
• 공백이 없을 때에도 기본적으로 새 문자열을 리턴한다. (복사) 

const str = ' 오늘의 연습은 조건문과 문자열 ';

str.trim();
//'오늘의 연습은 조건문과 문자열'

String.prototype.match()

• 문자열이 정규식과 일치하는 부분을 리턴한다. 

const str = '123오늘은';
const check = /[0-9]/g;

str.match(check);
// ['1', '2', '3']

String.prototype.replace()

• 어떤 패턴에 일치하는 일부 혹은 전체 부분이 교체된 새로운 배열을 리턴한다.
• replace() 메서드는 일치하는 첫번째 부분만 교체하지만, replaceAll은 일치하는 모든 부분을 교체한다.

const str2 = '오늘은 흐리다';

str2.replace('흐리다', '맑다')
// '오늘은 맑다'

const str3 = '오늘은 흐리고 흐리다';
str3.replace('흐리', '맑');
// '오늘은 맑고 흐리다'

//replaceAll
str3.replaceAll('흐리', '맑');
//'오늘은 맑고 맑다'

String.prototype.startsWith()

• 어떤 문자열이 특정 문자로 시작하는지를 확인하여 boolean 을 리턴한다.

const str = 'JavaScrit';

str.startsWith('Java'); // true
str.startsWith('Kova') // false

// 특정 문자열로 종료되는지 여부를 확인하는 endsWith()메서드도 있다.
str.endsWith('t'); // true

String.prototype.padStart()

• 현재 문자열의 시작을 다른 문자열로 채워, 주어진 길이를 만족하는 새 문자열을 리턴한다.

str.padStart(15, '*') // '******JavaScrit'

특정 length가 될 때까지 문자열의 마지막에 지정된 문자열을 채우는 padEnd()메서드도 있다.
str.padEnd(15, '*') // 'JavaScrit******'

String.prototype.repeat()

• 문자열을 주어진 횟수만큼 반복해 붙인 새로운 문자열을 리턴한다.

str.repeat(5);
// 'JavaScritJavaScritJavaScritJavaScritJavaScrit'

 

참고자료

• https://www.codingninjas.com/codestudio/library/javascript-boxing-and-unboxing

JavaScript Boxing and Unboxing

• https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String

String - JavaScript | MDN