JavaScript 내장 문자열 메소드 한눈에 보기

포스팅 목적

문자열과 관련된 내장 메소드를 유형별로 분류하여, 사용할 최적의 메소드를 매번 찾기 귀찮아서 찾기 쉽도록  정리했습니다. MDN 홈페이지에 나와있는 메소드를 기준으로 하였습니다. 메소드의 유형이나 중요도는 제가 판단했기 때문에 주관적인 의견이 포함되어 있습니다.

 

유형별 메소드

• 자르기 : slice, split, substring
• 요소 찾기 : charAt, search, indexOf / lastIndexOf
• 포함 여부 판단 : startsWith / endsWith, includes
• 추가 : concat, repeat, padStart / padEnd
• 공백 제거 : trim / trimStart / trimEnd
• 교체 : replace / replaceAll
• 변환 : toUpperCase / toLowerCase

 

자르기

• slice() : 문자열의 일부를 추출하면서 새로운 문자열을 반환합니다.
  

  const str = 'The quick brown fox jumps over the lazy dog.';
  
  console.log(str.slice(31));
  // expected output: "the lazy dog."
  
  console.log(str.slice(4, 19));
  // expected output: "quick brown fox"
  
  console.log(str.slice(-4));
  // expected output: "dog."
  
  console.log(str.slice(-9, -5));
  // expected output: "lazy"​

• split() : String 객체를 지정한 구분자를 이용하여 여러 개의 문자열로 나눕니다.
  

  const str = 'The quick brown fox jumps over the lazy dog.';
  
  const words = str.split(' ');
  console.log(words[3]);
  // expected output: "fox"
  
  const chars = str.split('');
  console.log(chars[8]);
  // expected output: "k"
  
  const strCopy = str.split();
  console.log(strCopy);
  // expected output: Array ["The quick brown fox jumps over the lazy dog."]​

• substring() : string 객체의 시작 인덱스로 부터 종료 인덱스 전 까지 문자열의 부분 문자열을 반환합니다.
  

  const str = 'Mozilla';
  
  console.log(str.substring(1, 3));
  // expected output: "oz"
  
  console.log(str.substring(2));
  // expected output: "zilla"​

 

요소 찾기

• charAt() : 문자열에서 특정 인덱스에 위치하는  유니코드 단일문자를 반환합니다. 
• search() : 정규 표현식과 이 String 객체간에 같은 것을 찾기 위한 검색을 실행합니다.
• indexOf() : 호출한 String 객체에서 주어진 값과 일치하는 첫 번째 인덱스를 반환합니다. 일치하는 값이 없으면 -1을 반환합니다.
• lastIndexOf() : 주어진 값과 일치하는 부분을 fromIndex로부터 역순으로 탐색하여, 최초로 마주치는 인덱스를 반환합니다. 일치하는 부분을 찾을 수 없으면 -1을 반환합니다.

 

포함 여부 판단

• startsWith() : 어떤 문자열이 특정 문자로 시작하는지 확인하여 결과를 true 혹은 false로 반환합니다.
• endsWith() : 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경합니다.
• includes() : 하나의 문자열이 다른 문자열에 포함되어 있는지를 판별하고, 결과를 true 또는 false 로 반환합니다.

 

추가

• concat() : 매개변수로 전달된 모든 문자열을 호출 문자열에 붙인 새로운 문자열을 반환합니다.
• repeat() : 문자열을 주어진 횟수만큼 반복해 붙인 새로운 문자열을 반환합니다.
• padStart() : 현재 문자열에 좌측부터 다른 문자열을 채워, 주어진 길이를 만족하는 새로운 문자열을 반환합니다.
• padEnd() : 현재 문자열에 우측부터 다른 문자열을 채워, 주어진 길이를 만족하는 새로운 문자열을 반환합니다.

 

공백 제거

• trim() : 문자열 양 끝의 공백을 제거합니다.
  공백이란 모든 공백문자(space, tab, NBSP 등)와 모든 개행문자(LF, CR 등)를 의미합니다.
• trimStart() : 문자열 시작부분의 공백을 제거합니다. 또한 trimLeft()라는 별칭으로 호출이 가능합니다.
• trimEnd() : 문자열 끝부분의 공백을 제거합니다. 또 해당 메서드는 trimRight() 라는 별칭으로 호출이 가능합니다.

 

교체

• replace() : 문자열 혹은 정규식 패턴에 일치하는 첫 번째 문자열이 교체된 새로운 문자열을 반환합니다.
  정규식의 형태에 따라 전체 패턴을 모두 변경할 수 있다.
  

  var str = "Hello World"; 
  str = str.replace(/o/g,"*"); // Hell* W*rld
  
  // replace(/o/g,"*") : o를 *로 전체 치환한다.
  // replace(/o/gi,"*") : o를 *로 대/소문자 구분 없이 전체 치환한다.
  // g : 발생할 모든 pattern에 대한 전역 검색​

• replaceAll() : 문자열 혹은 정규식 패턴에 일치하는 모든 부분이 교체된 새로운 문자열을 반환합니다.

 

변환

• toUpperCase() : 문자열을 대문자로 변환해 반환합니다.
• toLowerCase() : 문자열을 소문자로 변환해 반환합니다.

 

전체 문자열 메소드

• String.prototype[@@iterator]() (en-US)
• String.prototype.anchor() (en-US)
• String.prototype.at() (en-US)
• String.prototype.big() (en-US)
• String.prototype.blink() (en-US)
• String.prototype.bold() (en-US)
• String.prototype.charAt()
• String.prototype.charCodeAt()
• String.prototype.codePointAt() (en-US)
• String.prototype.concat()
• String.prototype.endsWith()
• String.prototype.fixed() (en-US)
• String.prototype.fontcolor() (en-US)
• String.prototype.fontsize() (en-US)
• String.fromCharCode()
• String.fromCodePoint() (en-US)
• String.prototype.includes()
• String.prototype.indexOf()
• String.prototype.italics() (en-US)
• String.prototype.lastIndexOf()
• String.prototype.link() (en-US)
• String.prototype.localeCompare()
• String.prototype.match()
• String.prototype.matchAll() (en-US)
• String.prototype.normalize()
• String.prototype.padEnd()
• String.prototype.padStart()
• String.raw()
• String.prototype.repeat()
• String.prototype.replace()
• String.prototype.replaceAll() (en-US)
• String.prototype.search()
• String.prototype.slice()
• String.prototype.small() (en-US)
• String.prototype.split()
• String.prototype.startsWith()
• String.prototype.strike() (en-US)
• String.prototype.sub() (en-US)
• String.prototype.substr()
• String.prototype.substring()
• String.prototype.sup() (en-US)
• String.prototype.toLocaleLowerCase() (en-US)
• String.prototype.toLocaleUpperCase() (en-US)
• String.prototype.toLowerCase()
• String.prototype.toSource()
• String.prototype.toString()
• String.prototype.toUpperCase()
• String.prototype.trim()
• String.prototype.trimEnd()
• String.prototype.trimStart()
• String.prototype.valueOf()

 

참고자료

• MDN String