문자열

---

자바스크립트에는 별도의 자료형이 없기 때문에 텍스트 형식 데이터들은 길이 상관없이 문자열 형태로 저장된다.!!

str1과 str2를 let으로 선언해주고 문자열을 할당할 때 작은따옴표('), 큰따옴표(") 둘 다 사용할 수 있다.

let str1 = 'Code states';
let str2 - "큰 따옴표도 입력됩니다";

1. 문자열의 특징

• 불변성(immutable)
  재할당하지 않는 한 read-only의 성격을 띈다.
  갑자기 read-only라니 무슨 얘긴가 싶지만 index로 접근은 가능하지만 수정은 할 수 없다라는 것이다.

  코드로 한번 봐보자!
  

let str = 'Hava a Good day!';
console.log(str[0]);	//H
console.log(str[3]);	//a

str에 Hava a Good day!라고 할당하고 보니 Have로 써야했는데 e대신 a를 써버렸다. 이때, a -> e로만 바꿔본다고 하자.

let str = 'Hava a Good day!';
str[3] = 'e';
console.log(str);

a자리에 e를 할당해주고 str을 찍으면 Have a Good day!가 나와야 할 것 같지만 문자열은 바뀌지 않고 Hava a Good day!로 출력된다.

이는 문자열이 가진 불변성 때문에 문자열 중간 하나의 글자만 바뀌지 않는다.
그럼 어떻게 써줘야 할까? "str을 재할당 해주면 된다"😅

str[3]을 기준으로 substring을 써서 문자열을 str[0]~str[2]와 str[4]~끝 문자열까지로 끊어주고 str[3]에는 'e'로 재할당한다.
+연산자를 사용해서 끊어준 문자열을 결합해준다.

let str = 'Hava a Good day!';
//str = 'Have a Good day!'
str = str.substring(0,3) + 'e' + str.substring(4);

• 다른 타입과 + 연산자를 했을 때 👉 "문자열화"
  다른 타입과 결합하면 string으로 변환된 값이 출력된다.

let str = 'Hello';
let str2 = 'World';
let num = 3;
let boolean = true;

//string + string
str+str2;
"HelloWorld"
//string + number
str + num;
"Hello3"
//string + boolean
str + boolean;
"Hellotrue"

2. length

length는 문자열의 길이를 알아낼 수 있는 Property(프로퍼티)이다.

📌 주의할 점!
자바스크립트에서는 length는 함수가 아니고 숫자가 저장되는 프로퍼티이다.
length()처럼 ()를 넣어 쓰면 안된다.

let str = 'I can do it';
str.length;	//11

//마지막 글자 찾기
str[str.length-1]; 	//t

길이는 띄워쓰기를 포함해서 카운트된다.

tostring
concat

3. 문자열 메소드

string에는 다양한 메소드들이 존재한다.
그 중에서 자주 쓰는 메소드들만 정리해보았다.

1) indexOf(검색할 값, 시작 위치)

찾고자 하는 문자열이 있는 index 위치를 반환한다.

전달인자(argument)에 찾고자 하는 문자열을 넣으면 처음으로 일치하는 index 위치를 반환해준다. 찾고자 하는 문자열이 없을 때는 -1을 반환한다.

아래 str에 i는 14번째와 18번째에 있지만 처음 일치하는 14번째 index 위치만 출력되는 것을 볼 수 있다.

let str = 'Please enter with id';
str.indexOf( 'i' ); 	// 14

indexOf()는 대, 소문자를 구분해서 찾는다.
please를 찾아주게 되면 소문자 p이를 구분해서 찾기 때문에 일치하는 문자열이 없다고 인식하며 -1을 출력한다.

str.indexOf( 'Please' );	// 0
str.indexOf( 'please' );	// -1

🔖 lastIndexOf(검색할 값, 시작위치)는 indexOf()와 유사한 기능이지만 끝에서 부터 문자열을 찾아준다.

let str = 'Please enter with id';
str.lastIndexOf( 'i' );		// 18

2) includes(검색할 값, 시작위치)

찾는 문자열의 여부에 따라 boolean(true, false)값을 반환한다.

indexOf()가 위치값을 반환했다면 includes는 찾는 문자열이 있을 때 true를 반환한다는데 차이점이 있다.

 있는지 여부만 알고 싶을 때 쓰기 적합한 메소드이다.

let str = '오늘은 비가 오니 우산을 챙기세요';
str.includes('우산');		// true
str.includes('3');		//false

문자열 찾는 시작 위치를 정해주고 '우산'을 찾아보자

//시작 위치를 지정해서 찾기
str.includes('우산', 11);	//false

찾는 위치를 str[11]로 지정하게 되면 '을'부터 검색한다. 이 후 문자열에 '우산'이 포함되어 있지 않으니깐 false를 출력한다.

3) startWith(검색할 값) / endWith(검색할 값)

메소드 이름대로 검색한 문자열로 시작(끝) 되는지 여부를 boolean값으로 반환해준다.

let str = '오늘은 비가 오니 우산을 챙기세요';
str.startWith('오늘');		// true
str.endWith('세요');		//true

4) substring(start, end) / slice(start, end)

start와 end 사이에 있는 문자열을 반환한다.
엄밀히 말하자면 start 위치에 있는 문자열 부터 end 전까지에 있는 문자열이 반환된다.

substring()과 slice()가 문자열 반환을 위한 메소드지만 약간의 차이점이 있다.
예시를 보면 더 잘 이해할 수 있다.🤩

• start < end일 경우
  👉 substring()과 slice() 값은 같다.

0에서 1까지 사이의 문자열을 반환한다는 의미는 0에서 1 앞의 index까지를 말하며, 결국은 str[0]만 반환하게 된다.

let str= 'codestates';
str.substring(0,1);	// c
str.slice(0,1);		// c

//str[0]~str[4]까지의 문자열을 반환
//5번째 위치의 문자열은 반환하지 X
str.substring(0,5);	// codes
str.slice(0,5);		// codes

//end 인수 생략의 경우 -> 문자열 끝까지 반환
str.substring(4);	// states
str.slice(4);		// states

• start > end일 경우
  👉 substring()은 동일한 문자열을 반환하지만 slice()는 빈문자열을 반환한다.

let str= 'codestates';
str.substring(0,5);	// codes
str.substring(5,0);	// codes

str.slice(0,5);		// codes
str.slice(5,0);		// ""

• start, end가 음수일 경우
  👉 substring()은 빈문자열을 반환하지만 slice()는 끝에서부터 카운팅한 문자열을 반환한다.

let str= 'codestates';
str.substring(-4,-1);	// ""

// 끝에서 4번째부터 시작해 끝에서 1번째 위치 전까지
str.slice(-4,-1);		// ate

slice가 음수를 허용한다는 점에서 더 유연한 메소드로 볼 수 있다.
필요한 경우에 따라 쓰면 되겠다~

5) split(seperator)

지정한 구분자(seperator)를 이용하여 여러 개의 문자열로 나눠준다.

구분자로 주고 문자열을 나누면 분리된 문자열이 포함된 배열 형식으로 반환된다.
split() 메소드는 csv형식 처리할 때 유용하다.

아래는 인자값을 ,로 주어 ',' 기준으로 문자열을 쪼개줬다.

let monthString = 'Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec';

let str = monthString.split(',');

console.log( str );
// ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]
console.log( str[0] );	// Jan
console.log( str[5] );	// Jun

''안에 공백 한 칸을 넣으면 공백을 기준으로 문자열을 쪼개준다.

let str = 'Hello from the other side';

let result = str.split(' ');
console.log( result );	// ["Hello", "from", "the", "other", "side"]
console.log( result[3] );	// other

문자열을 쪼개고, 반환할 문자열의 개수도 제한해줄 수 있다.
공백을 중심으로 쪼개주고 3개의 문자열만 반환해줘라는 의미가 된다.

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

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

6) toLowerCase() / toUpperCase()

대문자 -> 소문자 / 소문자 -> 대문자로 변환시켜준다.

let str = 'codestates';
let str2 = 'CODESTATES';

str.toUpperCase();	// CODESTATES
str2.toLowerCase();	// codestates

메소드를 써서 변환시켜준다고 str에 할당된 값이 대(소)문자로 바뀌는 건 아니다!! (문자열의 immutable 성격)

찍어보면 원본 그대로 출력되는 것을 볼 수 있다.

console.log(str);		// codestates

console.log(str2);		// CODESTATES