[자바스크립트] string 메서드 정리 ✨

 

 

 

 `concat()`

• 매개변수로 전달된 모든 문자열을 호출 문자열에 붙인 새로운 문자열로 반환

const str1 = 'hello'
const str2 = 'world'

str1.concat(' ', str2)

 `includes()`

• 하나의 문자열이 다른 문자열에 포함되어 있는지 판별
• 결과를 true false로 반환

const sentence = 'The quick brown fox jumps over the lazy dog.';

const word = 'fox';

sentence.includes(word) ? 'is' : 'is not'

 

`indexOf()`

• `string` 객체에서 주어진 값과 일치하는 첫번째 인덱스를 반환
• 값이 없으면 -1로 반환

const paragraph = "I think Ruth's dog is cuter than your dog!";

const searchTerm = 'dog';
const indexOfFirst = paragraph.indexOf(searchTerm);

console.log(indexOfFirst) //15

`lastIndexOf()`

• 주어진 값과 일치하는 부분을 `fromIndex`로부터 역순으로 탐색
• 최초로 마주치는 인덱스 반환
• 없으면 -1로 반환

const paragraph = "I think Ruth's dog is cuter than your dog!";

const searchTerm = 'dog';

console.log(paragraph.lastIndexOf(searchTerm)) //38

 

---

 

`padEnd()`

• 이 문자열을 주어진 문자열로 채워서 결과 문자열이 지정된 길이에 도달하도록 함

const str1 = 'Breaded Mushrooms';

console.log(str1.padEnd(25, '.')
//Breaded Mushrooms........

"abc".padEnd(10); // "abc       "
"abc".padEnd(10, "foo"); // "abcfoofoof"
"abc".padEnd(6, "123456"); // "abc123"
"abc".padEnd(1); // "abc"

`padStart()`

• 결과 문자열이 주어진 길이에 도달할 때까지 이 문자열의 시작 부분에 다른 문자열을 채움

const str1 = '5'

console.log(atr1.padStart(2, '0') //'05'

const fullNumber = '2034399002125581'
const last4Digits = fullNumber.slice(-4)
const maskedNumber = last4Digits.padStart(fullNumber.length, '*')

console.log(maskedNumber) // "************5581"

"abc".padStart(10); // "       abc"
"abc".padStart(10, "foo"); // "foofoofabc"
"abc".padStart(6, "123465"); // "123abc"
"abc".padStart(8, "0"); // "00000abc"
"abc".padStart(1); // "abc"

 

`repeat()`

• 문자열을 주어진 횟수만큼 반복해 새로운 문자열을 반환

str.repeat(count)

"abc".repeat(-1); // RangeError
"abc".repeat(0); // ''
"abc".repeat(1); // 'abc'
"abc".repeat(2); // 'abcabc'
"abc".repeat(3.5); // 'abcabcabc' (count will be converted to integer)
"abc".repeat(1 / 0); // RangeError

 

`replace()`

• pattern의 단일, 혹은 모든 일치 항목이 replacement로 대치된 새로운 문자열로 반환
• 단, 오직 첫번째 항목만 변경

const paragraph = "I think Ruth's dog is cuter than your dog!";

console.log(paragraph.replace("Ruth's", 'my'));
// Expected output: "I think my dog is cuter than your dog!"

"xxx".replace("", "_"); // "_xxx"

 

`replaceAll()`

• pattern의 모든 일치 항목으로 replacement로 대체된 새 문자열로 반환

const paragraph = "I think Ruth's dog is cuter than your dog!";

console.log(paragraph.replaceAll('dog', 'monkey'));
// Expected output: "I think Ruth's monkey is cuter than your monkey!"

 

`search()`

• 정규식과 이 문자열 간에 일치하는 항목이 있는지 검색하여 문자열에서 첫 번째로 일치하는 항목의 인덱스를 반환

const paragraph = "I think Ruth's dog is cuter than your dog!";

// Anything not a word character, whitespace or apostrophe
const regex = /[^\\w\\s']/g;

console.log(paragraph.search(regex));
// Expected output: 41

console.log(paragraph[paragraph.search(regex)]);
// Expected output: "!"

 

`slice()`

• 문자열의 일부를 추출하여 새로운 문자열로 반환
• 인덱스는 0에서부터 시작
• 예를 들어, `str.slice(4, 8)`이면, 다섯 번째 문자부터 여덟번째 문자까지 추출(4, 5, 6, 7)
  • 즉, 시작하는 인덱스는 포함하되 마지막 인덱스는 포함하지 않는 구조

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()`

• 여러 개의 문자열로 나눔

const str = 'The quick brown fox jumps over the lazy dog.';

const words = str.split(' ')
console.log(word[3]); //fox

 

`startsWith()`

• string 메서드로 어떤 문자열의 문자로 시작하는지 결과를 true false로 반환

const str1 = 'Saturday night plans';

console.log(str1.startsWith('Sat'));
//  true

console.log(str1.startsWith('Sat', 3));
//  false

 

`subString()`

• string 객체의 시작 인덱스로부터 종료 인덱스 전까지의 문자열의 부분 문자열을 반환
• 예를 들어, `subString(1, 3)`이면, 1, 2만 추출

const str = 'Mozila'
console.log(str.substring(1, 3))
//oz

 

`String.prototype[@@iterator]()`

• [@@iterator]() 메서드는 순회 프로토콜을 구현하여 전개 구문 및 `for … of `루프와 같이 반복자를 기대하는 대부분의 구문에서 문자열을 사용할 수 있게 함

const str = "The quick red fox jumped over the lazy dog's back.";

const iterator = str[Symbol.iterator]()
let theChar = iterator.next()

while (!theChar.done && theChar.value !== ' ') {
  console.log(theChar.value)
  theChar = iterator.next()
}

// Expected output: "T"
  //                  "h"
  //                  "e"

 

`toLocalLowerCase()`

• 어떤 지역 특정 대/소문자 매핑에 따른 소문자로 변환된 문자열을 반환

const dotted = 'İstanbul';

console.log(`EN-US: ${dotted.toLocaleLowerCase('en-US')}`);
// Expected output: "i̇stanbul"

console.log(`TR: ${dotted.toLocaleLowerCase('tr')}`);
// Expected output: "istanbul"

 

`toLocalLowerCase()`

• 어떤 지역 특정 대/소문자 매핑에 따른 대문자로 변환된 문자열 값을 반환

const city = 'istanbul';

console.log(city.toLocaleUpperCase('en-US'));
// Expected output: "ISTANBUL"

console.log(city.toLocaleUpperCase('TR'));
// Expected output: "İSTANBUL"

 

`toLowerCase()`

• 문자열을 소문자로 반환

const sentence = 'The quick brown fox jumps over the lazy dog.';

console.log(sentence.toLowerCase());
// Expected output: "the quick brown fox jumps over the lazy dog."

 

`toUpperCase()`

• 문자열을 대문자로 반환

const sentence = 'The quick brown fox jumps over the lazy dog.';

console.log(sentence.toUpperCase());
// Expected output: "THE QUICK BROWN FOX JUMPS OVER THE LAZY DOG."

 

`toString()`

• 객체의 문자열 표현을 반환

const stringObj = new String('foo') //{ 'foo' }

console.log(stringObj.toString()) // 'foo'

 

`valueOf()`

• 문자열의 값을 반환

const stringObj = new String('foo');

console.log(stringObj);
// Expected output: String { "foo" }

console.log(stringObj.valueOf());
// Expected output: "foo"

 

`trim()`

• 문자열 양 끝의 공백을 제거하면서 원본 문자열을 수정하지 않고 새로운 문자열을 반환

const greeting = '   Hello world!   ';

console.log(greeting);
// Expected output: "   Hello world!   ";

console.log(greeting.trim());
// Expected output: "Hello world!";

 

`trimEnd()`

• 문자열 마지막의 공백을 제거하고 원본 문자열 수정 없이 새로운 문자열을 반환

const greeting = '   Hello world!   ';

console.log(greeting);
// Expected output: "   Hello world!   ";

console.log(greeting.trimEnd());
// Expected output: "   Hello world!";

 

`trimgStart()`

• 문자열 시작의 공백을 제거하고 기존 문자열의 수정없이 새로운 문자열을 반환

const greeting = '   Hello world!   ';

console.log(greeting);
// Expected output: "   Hello world!   ";

console.log(greeting.trimStart());
// Expected output: "Hello world!   ";