String 타입(문자형)

String 타입(문자형)

String - JavaScript | MDN

string 타입은 인간의 언어(자연어)를 컴퓨터에서 표현하기 위한 데이터 타입이다.

따옴표  '  , 쌍따옴표  "  , 역따옴표(백틱 backtick)  `  으로 감싸면 된다.(윈도우에서 백틱은 키보드 숫자 1옆에 있으며  맥북의 경우 백틱은 영어로 전환하고 물결(~)을 누르면 입력할 수 있다.)

let str = 'Single quotes';
let str2 = "Long time no see";
let phrase = `can embed another ${str}`;

큰따옴표와 작은따옴표는 ‘기본적인’ 따옴표로, 자바스크립트에서는 이 둘에 차이를 두지 않는다.

역 따옴표(백틱)로 변수나 표현식을 감싼 후 ${…}안에 넣어주면, 아래와 같이 원하는 변수나 표현식을 문자열 중간에 손쉽게 넣을 수 있다. 특히 백틱으로 만든 문자열은 줄바꿈도 가능하다.

let name = "John";

// 변수를 문자열 중간에 삽입
alert( `Hello, ${name}!` ); // Hello, John!

// 표현식을 문자열 중간에 삽입
alert( `the result is ${1 + 2}` ); // the result is 3

`JavaScript (줄여서 JS)는 일급 함수를 사용하는 가벼운 객체 지향 인터프리터 언어이며 
웹페이지의 스크립트 언어로 잘 알려져 있지만, 브라우저가 아닌 환경에서도 많이 사용된다.
프로토타입 기반, 다중 패러다임 스크립트 언어이며, 동적이고 명령어, 객체 지향, 함수 프로그래밍
스타일을 지원한다.`

 

+ 로 문자열을 이어붙일 수 있다. + 는 문자열 연결 연산자로써 쓰인다. 

한자나 이모지와 같은 특수문자도 문자열로 만들 수 있고, 숫자와 문자를 조합해서 문자열로 만들 수도 있다. 

'사과'
"JavaScript"
"欢迎你"
"😇"
"안녕하세요" + "!!"; // 안녕하세요!!
"감사합니다." + " " + "🙏" // 감사합니다. 🙏
1 + "1" // 11

문자열의 length 속성

Array.length - JavaScript | MDN

문자열의 length 속성을 이용하여 문자열의 길이를 확인할 수 있다. 문자열 값에 .length 를 붙이면 된다.

console.log('이 문자는 모두 몇 글자일까?'.length); // 16

---

인덱스(Index)

작성한 각 문자열은 순서를 가지고 있다. 각 문자가 몇번째 위치하는지는 인덱스로 확인할 수 있으며 첫 번째 문자의 인데스는 0으로 시작한다. JavaScript는 인간이 수를 셀때 1,2,3 ... 으로 세는것이 아니고 0부터 시작한다. 

let str = 'codestates';
console.log(str[0]); // 'c'
console.log(str[4]); // 's'

---

문자열 메서드 

String - JavaScript | MDN

유용한 메서드

• 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

• includes() : 문자열 내에 특정 문자나 문자가 포함되어 있는지 확인한다.

'🍎🍓🍉🍇'.includes('🍎'); // true
'🍎🍓🍉🍇'.includes('🖥'); // false
'최초의 JavaScript는 Netscape의 Brendan Eich에 의해 만들었다.'.includes('Eich'); // true
'최초의 JavaScript는 Netscape의 Brendan Eich에 의해 만들었다.'.includes('Dahl'); // false