🔍 문자열

character 접근

◾ str[ ]

var str = 'abcdefg';
console.log(str[0]); // 'a'
console.log(str[1]); // 'b'
console.log(str[2]); // 'c'

//단, 접근은 가능하지만 사용 불가(read-only)
str[0] = 'A';
console.log(str); //not Abcdefg, abcdefg로 출력됨. 바꿀 수 없음

문자열은 항상 read-only, 새로 할당하지 않으면 값은 절대 바뀌지 않는다.
string type 과 다른 type 사이에 + 연산자를 사용하면 , 뒤에 있는 값이 string으로 강제 변환된 값을 출력한다.(- 연산자는 사용 불가)

1 + '1' //'11'
[0,1,2] + '3' // '0,1,2,3'

Length Property

문자열의 전체 길이를 반환한다.

var str = 'banana';
console.log(str.length); // 6

👀 Method

모든 string method는 immutable이다. (원본 변형x)

✔ indexOf, lastIndexOf, includes

//indexOf: 문자열 서칭
'Blue Whale'.indexOf('Blue'); // 0
'Blue Whale'.indexOf('blue'); // -1(없으면 -1 return)
'Blue Whale'.indexOf('Whale'); // 5
'Blue Whale Whale'.indexOf('Whale'); //5(같은 값이 있을 경우, 앞에 있는 문자열로 return)

//lastIndexOf: 문자열의 뒤에서 부터 찾는다.
'canal'.lastIndexOf('a'); // 3

//includes: True or False return
'blue whale'.includes('blue'); // true
'blue whale'.includes('Blue'); // false

✔ split

csv 형식을 처리할 때 유용하다.

//ex1
let str = '사과, 바나나, 오렌지, 배, 감, 딸기';

let word = str.split(', ');
console.log(word); // ['사과', '바나나', '오렌지', '배', '감', '딸기']

//ex2
let str = '나는 오늘 문자열을 다루는 방법을 학습했습니다.';

let word = str.split(' '); //space 1
console.log(word); // ['나는', '오늘', '문자열을', '다루는', '방법을', '학습했습니다.']

//ex3
let alphabet = 'abcdefghijklmnopqrstuvwxyz';

let char = alphabet.split('');//space 0
console.log(char); // ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z']

✔ substring, slice

구간에 있는 문자열을 반환할 때 사용하며, slice가 범용적으로 사용된다.

const str = 'abcdefg';
console.log(str.substring(0, 3)); //'abc', end를포함 x
console.log(str.substring(3, 0)); //'abc', start와 end가 바뀌어도 상관없다.
console.log(str.substring(1, 4)); //'bcd'
console.log(str.substring(-1, 4)); //'abcd', 음수는 0으로 취급한다.
console.log(str.substring(0, 20)); //'abcdefg', index 범위 초과 시, str 모두 출력

slice와 substring의 차이점

start > end일 때

let str = 'Blue Whale';

let a = str.substring(4, 0);
let b = str.slice(4, 0);

console.log(a); // Blue
console.log(b); // 빈 문자열

start, end < 0일때

let str = 'Blue';

//start < 0
let a = str.substring(-3, 4);
let b = str.substring(-3);
let c = str.slice(-3, 4);
let d = str.slice(-3);

//substring은 start가 음수일 경우0으로 취급한다.
console.log(a); // Blue, substring(0,4)
console.log(b); // Blue, substring(0,4)

//slice는 start가 음수일 경우 뒤에서부터 음수만큼 앞으로 이동한다.
console.log(c); // lue, slice(1,4)
console.log(d); // lue, slice(1,4)

//end < 0
let e = str.substring(0, -1);
let f = str.slice(0, -1);

console.log(e); // 빈 문자열, substring(0,0)
console.log(f); // Blu, substring(0,3)

✔ toLowerCase / toUpperCase

영문으로 된 문자열 대소문자를 변환할 때 사용한다.

//toUpperCase
let alphabet = 'abcdefg';
console.log(alphabet.toUpperCase()); // ABCDEFG

//toLowerCase
let alphabet = 'ABCDEFG';
console.log(alphabet.toLowerCase()); // abcdefg

✔ trim

앞, 뒤의 공백을 제거할 때 사용한다.

const str = ' 가 나 다 라 마 바 사 ';

str.trim(); // '가 나 다 라 마 바 사'

✔ 공백 문자

공백 문자	설명
\t	탭(tab)
\r\n	캐리지 리턴/enter
\n	줄바꿈(new line)

✔ match

찾고 싶은 단어가 문자열에 포함되어 있는 지 확인한다.

const str = 'blue Whale';

str.match('blue'); // ['blue', index: 0, input: 'blue Whale', groups: undefined]

//ex
const str1  = 'blue sky, blue note, blue pen';
let res = str1.match(/blue/gi);
console.log(res); //['blue', 'blue', 'blue']

✔ replace

특정 문자를 다른 문자로 치환할 때 사용한다.

const str = '가나다 라마바 사가나';
let a = str.replace('가','하');
let b = str.replace(/가/gi,'하'); //g: 모든 문자열을 변경(global), i: 대소문자 무시(ignore)

console.log(a); // 하나다 라마바 사가나(가장 앞에 있는 '가'만 변경)
console.log(b); // 하나다 라마바 사하나(모든 '가' -> '하')

js template literal 표현식 삽입법

표현식(expression)을 포함해 문자열을 표현하는 방식으로, 작은따옴표(')나 큰따옴표(") 대신 백틱(`)으로 감싼다.

//일반
let a = '떡볶이';
let b = 3000;
let str = a + ' 1인분에 ' + b + '원';
console.log(str);   // 떡볶이 1인분에 3000원

//표현식 삽입법
let a = '떡볶이';
let b = 3000;
let str = `${a} 1인분에 ${b}원`;
console.log(str);   // 떡볶이 1인분에 3000원

Reference: 코드스테이츠