2022. 12. 15. 16:28ㆍ코드스테이츠/코드스테이츠S1: Chapter & Unit
String 타입
JavaScript 데이터 타입 String(문자열)은 인간의 언어, 자연어를 JavaScript에서 표현하기 위한 데이터 타입입니다.
따옴표(’), 쌍따옴표(”), 백틱(`)으로 감싸면 됩니다. 맥북의 경우 백틱은 영어로 전환하고 물결(~)을 누르면 입력할 수 있습니다.
한자나 이모지와 같은 특수문자도 문자열로 만들 수 있고, 숫자와 문자를 조합해서 문자열로 만들 수도 있습니다.
특히 백틱으로 만든 문자열은 줄바꿈도 가능합니다.
로 문자열을 이어붙일 수 있습니다. 문자열과 문자열을 이어붙일 때의 + 는 문자열 연결 연산자로써 쓰입니다. 다른 타입과 이어붙이려고 하면 모두 문자열로 변합니다. 특히, 숫자와 이어붙이기를 시도하다가 예상 못한 결과를 얻지 않도록 조심합니다. 위 이유로 가능하면 다른 타입 간의 연산을 하지 않도록 조심해야 합니다.
"박수범"
'순양'
'잡아라스크립트'
`가나다라마
바사 아자차카
타파하`
+ 로 문자열을 이어붙일 수 있습니다. 문자열과 문자열을 이어붙일 때의 + 는 문자열 연결 연산자로써 쓰입니다.
다른 타입과 이어붙이려고 하면 모두 문자열로 변합니다.
특히, 숫자와 이어붙이기를 시도하다가 예상 못한 결과를 얻지 않도록 조심합니다.
위 이유로 가능하면 다른 타입 간의 연산을 하지 않도록 조심해야 합니다.
"안녕하세요"+"!!" // 안녕하세요!!
"네"+" "+"안녕하세요?" //네 안녕하세요?
23 + "5" // 235
23 + 5 // 28
"23"+"5" // 235
'HELLO WORLD'.toLowerCase(); // .toLowerCase는 문자열을 소문자로 변경, 'hello world'
'hello world'.toUpperCase(); // .toUpperCase는 문자열을 대문자로 변경, 'HELLO WORLD'
'hello '.concat('world'); // .concat 문자열 연결 연산자 + 처럼 문자열 이어붙일수 있음. 'hello world'
'hello world'.slice(0, 7); // .slice 문자열의 인덱스를 기준으로 자름. 'hello wo'
문자열의 length 속성
문자열의 length 속성을 이용하여 문자열의 길이를 확인할 수 있습니다. 문자열 값에 .length 를 붙이면 됩니다.
console.log("코끼리아저씨는코가손이래".length); // 12
console.log("나는문어 꿈을 꾸는 문어."); // 띄워쓰기도 문자열로 치기 때문에 14
인덱스(Index)
문자열의 각 문자는 순서를 가지고 있습니다. 각 문자가 몇 번째에 위치하는지 인덱스(Index)로 확인할 수 있습니다. 첫 번째 문자의 인덱스는 0입니다. JavaScript는 우리 일상생활에서 순서를 셀 때 1부터 1, 2, 3 … 세는 것이 아니고, 0부터 세는 점을 주의해주세요. 이를 Zero-based numbering이라고 합니다.
let str = "elements";
console.log(str[1]); // 'l'
console.log(str[5]); // 'n'
문자열 주요 메서드
문자열의 유용한 메서드 일부를 소개합니다.
- toLowerCase() : 문자열을 소문자로 변경합니다.
- toUpperCase() : 문자열을 대문자로 변경하니다.
- concat() : 문자열 연결 연산자 + 처럼 문자열을 이어붙일 수 있습니다.
- slice() : 문자열의 일부를 자를 수 있습니다.
'HELLO WORLD'.toLowerCase(); // 소문자변환 'hello world'
'hello world'.toUpperCase(); // 대문자변환 'HELLO WORLD'
'hello '.concat('world'); // 문자열 이어줌 'hello world'
'hello world'.slice(0, 5); // 인덱스 기준으로 잘라줌 'hello'
- indexOf() : 문자열 내에 특정 문자나 문자가 인덱스에서 몇 번째에 위치하는지 확인합니다.
- 만약 찾는 문자가 2개 이상일 경우, 가장 앞에 있는 문자의 인덱스를 조회합니다.
- 포함되어 있지 않으면 -1 을 반환합니다.
'🍎🍓🍉🍇'.indexOf('🍎'); // 딸기는 문자열 인덱스의 가장 첫번째에 포함 되므로 0
'🍎🍓🍉🍇'.indexOf('★'); // 별은 문자열에 포함되지 않으므로 -1
'최초의 JavaScript는 Netscape의 Brendan Eich에 의해 만들었다.'.indexOf('Eich'); // 34
'최초의 JavaScript는 Netscape의 Brendan Eich에 의해 만들었다.'.indexOf('Dahl'); // -1
궁금증.
1.slice() 메서드와 split() 메서드는 각각 쓰임새가 다른가? 다름다면 어떤 기준에 맞춰 쓰는가?
2.indexOf() 메서드는 패스워드의 보안을 위해 특수문자를 반드시 기입하라는 경우가 있는데, 이러한 경우에 .indexOf()를 사용하는 경우가 있는가?
'코드스테이츠 > 코드스테이츠S1: Chapter & Unit' 카테고리의 다른 글
Unit4-[CSS] 셀렉터 (0) | 2022.12.22 |
---|---|
Unit2-[JavaScript] 기초 [함수] (0) | 2022.12.21 |
Unit2-[JavaScript] 기초 [조건문] (2) | 2022.12.17 |
Unit2-[JavaScript] 기초 [Boolean Type] (0) | 2022.12.15 |
Unit2-[JavaScript] 기초 [Number Type] (0) | 2022.12.15 |