[JavaScript - 4] 문자열 메서드

먼저 알고 가기!

• string 타입과 다른 타입사이에 + 연산자를 쓰면 string 형식으로 변환한다. ex) "123" + 1 = "1231"
• 공백 문자 : 스페이스, 탭(\t), Carrige return(\r, \n) 및 return 문자(\n)
• 자료.length를 쓰면 해당 자료의 길이(개수)를 리턴 해준다!

---

String.prototype.indexOf()

indexOf() 메서드는 호출한 String 객체에서 주어진 값과 일치하는 첫 번째 인덱스를 반환합니다. 

일치하는 값이 없으면 -1을 반환합니다.

str.indexOf(searchValue[, fromIndex])

1. searchValue

찾으려는 문자열. 아무 값도 주어지지 않으면 문자열 "undefined"를 찾으려는 문자열로 사용합니다.

 

2. fromIndex (Optional)

문자열에서 찾기 시작하는 위치를 나타내는 인덱스 값입니다. 어떤 정수값이라도 가능합니다.

기본값은 0이며, 문자열 전체를 대상으로 찾게 됩니다. 만약 fromIndex 값이 음수이면 전체 문자열을 찾게 됩니다.

만약 fromIndex >= str.length 이면, 검색하지 않고 바로 -1을 반환합니다.

searchValue가 공백 문자열이 아니라면, str.length를 반환합니다.

 

3. return

searchValue의 첫 번째 등장 인덱스. 찾을 수 없으면 -1.

'Blue Whale'.indexOf('Blue');     // returns  0
'Blue Whale'.indexOf('Blute');    // returns -1
'Blue Whale'.indexOf('Whale', 0); // returns  5
'Blue Whale'.indexOf('Whale', 5); // returns  5
'Blue Whale'.indexOf('Whale', 7); // returns -1
'Blue Whale'.indexOf('e', 7);     // returns  3
'Blue Whale'.indexOf('');         // returns  0
'Blue Whale'.indexOf('', 9);      // returns  9
'Blue Whale'.indexOf('', 10);     // returns 10
'Blue Whale'.indexOf('', 11);     // returns 10

---

String.prototype.lastindexOf()

lastIndexOf() 메서드는 주어진 값과 일치하는 부분을 fromIndex로부터 역순으로 탐색하여, 

최초로 마주치는 인덱스를 반환합니다. 일치하는 부분을 찾을 수 없으면 -1을 반환합니다.

str.lastIndexOf(searchValue[, fromIndex])

1. searchValue

탐색할 문자열. 빈 값을 제공할 경우 fromIndex를 반환합니다.

 

2. fromIndex (Optional)

탐색의 시작점으로 사용할 인덱스. fromIndex >= str.length인 경우 모든 문자열을 탐색합니다.

fromIndex < 0인 경우엔 0을 지정한 것과 동일합니다.

 

3. return

문자열 내에서 searchValue가 마지막으로 등장하는 인덱스. 등장하지 않으면 -1

'canal'.lastIndexOf('a');     //  3 반환
'canal'.lastIndexOf('a', 2);  //  1 반환
'canal'.lastIndexOf('a', 0);  // -1 반환
'canal'.lastIndexOf('x');     // -1 반환
'canal'.lastIndexOf('c', -5); //  0 반환
'canal'.lastIndexOf('c', 0);  //  0 반환
'canal'.lastIndexOf('');      //  5 반환
'canal'.lastIndexOf('', 2);   //  2 반환

---

String.prototype.includes()

includes() 메서드는 하나의 문자열이 다른 문자열에 포함되어 있는지를 판별하고, 결과를 true 또는 false 로 반환합니다.

str.includes(searchString[, position])

1. searchString

탐색할 문자열. 빈 값을 제공할 경우 fromIndex를 반환합니다.

 

2. position (Optional)

탐색의 시작점으로 사용할 인덱스. fromIndex >= str.length인 경우 모든 문자열을 탐색합니다.

fromIndex < 0인 경우엔 0을 지정한 것과 동일합니다.

 

3. return

문자열을 찾아내면 true. 실패하면 false.

var str = 'To be, or not to be, that is the question.';

console.log(str.includes('To be'));       // true
console.log(str.includes('question'));    // true
console.log(str.includes('nonexistent')); // false
console.log(str.includes('To be', 1));    // false
console.log(str.includes('TO BE'));       // false

---

String.prototype.split()

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

split()
split(separator)
split(separator, limit)

1. separator (Optional)

원본 문자열을 끊어야 할 부분을 나타내는 문자열을 나타냅니다. 

실제 문자열이나 정규표현식을 받을 수 있습니다. 

문자열 유형의 separator가 두 글자 이상일 경우 그 부분 문자열 전체가 일치해야 끊어집니다. 

separator가 생략되거나 str에 등장하지 않을 경우, 반환되는 배열은 원본 문자열을 유일한 원소로 가집니다. 

separator가 빈 문자열일 경우 str의 각각의 문자가 배열의 원소 하나씩으로 변환됩니다.

 

2. limit (Optional) 

끊어진 문자열의 최대 개수를 나타내는 정수입니다. 

이 매개변수를 전달하면 split() 메서드는 주어진 separator가 등장할 때마다 문자열을 끊지만 배열의 원소가 limit개가 되면 멈춥니다. 지정된 한계에 도달하기 전에 문자열의 끝까지 탐색했을 경우 limit개 미만의 원소가 있을 수도 있습니다. 남은 문자열은 새로운 배열에 포함되지 않습니다.

 

3. return

주어진 문자열을 separator마다 끊은 부분 문자열을 담은 Array.

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."]

var myString = 'Hello World. How are you doing?';
var splits = myString.split(' ', 3);

console.log(splits);
// ["Hello", "World.", "How"]

---

String.prototype.slice()

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

str.slice(beginIndex[, endIndex])

1. beginIndex

만약 음수라면, 뒤에서 부터 시작해서 정한 정수값으로 시작한다. ex) -3은 "뒤에서 3번째 부터 시작한다!" 라는 의미

또한, 음수로 설정한 정수값 만큼 더 셀 수가 없다? 그러면 0부터 시작으로 설정된다.

 

2. endIndex (Optional) 

입력한 정수타입미만으로  출력한다.

beginindex와 마찬가지로 만약 음수라면, 뒤에서 부터 시작한다. 정한 정수값을 포함하지 않는 값 까지이다.

endIndex가 생략된다면, 문자열 마지막까지 추출합니다. 

 

3. return

조건으로 만들어진 새로운 문자열.

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"

---

String.prototype.trim()

trim() 메서드는 문자열 양 끝의 공백을 제거하고 원본 문자열을 수정하지 않고 새로운 문자열을 반환합니다.

 여기서 말하는 공백이란 모든 공백문자(space, tab, NBSP 등)와 모든 개행문자(LF, CR 등)를 의미합니다.

한쪽 끝의 공백만 제거한 문자열을 반환하시려면 trimStart() 또는 trimEnd()를 사용합니다.

trim()

return

시작과 끝에서 공백이 제거된 str을 나타내는 새로운 문자열입니다. 공백은 white space 문자와 line terminators로 정의됩니다.

const greeting = '   Hello world!   ';

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

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

 

유용하게 쓰일 수 있는 메서드!

MDN을 참고해 사용법을 익혀보자!

 

• replace(searchValue,newValue) : searchValue를 찾아서 newValue로 치환 / 첫 번째로 찾은 문자열만 치환한다!
• toLowerCase() : 소문자를 대문자로 변환
• toUpperCase() : 대문자를 소문자로 변환
• String.prototype.substring()
• String.prototype.toString()
• String.prototype.padStart()
• String.prototype.match()
• String.prototype.repeat() 
• String.prototype.valueOf()
• String.prototype.concat()

String에서는 concat() 메서드보다 할당 연산자(+, +=)를 사용하는게 더 좋습니다.

성능 테스트 결과에 따르면 할당 연산자의 속도가 몇 배 빠릅니다.