chapter.02 자료형

 

1.  자바스크립트의 자료형

자바스크립크에는 다양한 자료형이 있다.

종류	이름	설명
원시 값 (Primitive Values)	Null	오직 null이라는 값만을 가지고 있으며, 객체가 없다는 의미이다.  의도적으로 값이 없을 때 null을 넣을 수 있다.
	Undefined	오직 Undefined이라는 값만을 가지고 있으며, 값이 없다는 의미이다. 일반적으로 값이 존재하지 않을 때 Undefined를 쓴다. 의도적으로 표현할 수 없다.
	Boolean	true와 false 두 가지의 값을 가지고 있다. (True 나 False는 안 된다 무조건 소문자만 가능하다)
	Number	숫자형으로 정수와 실수로 구분할 수 있다. 정수는 양의 정수, 음의 정수, 0 까지 포함하며 실수는 소수점까지 포함한다.
	Biglnt	길이의 제약 없이 정수를 다룰 수 있게 해주는 숫자형이다.
	String	문자형으로 말 그래도 문자를 값으로 가진다. 문자형은 작성 시에 꼭 "" 나 '' 안에 작성해야하며 `` 또한 사용이 가능한데, 해당 내용은 추후 자세히 다루겠다.
	Symblo	새로 도입된 7번째 데이터 타입으로, 변경이 불가능한 원시 타입의 값이다. 이름을 명확하게 부여하는 뜻으로 다른 값과 절대 중복되지 않는다. (어쩌면 html의 id와 비슷한 개념일 수도)
객체 (Object)	Object	유일하게 변경이 가능한 값이다.

 

 

---

 

 

2. 숫자형 (Number)

숫자형은 말 그대로 숫자형이다.

 

정수 :  ··· -3 -2 -1 0 1 2 3 ··· 등등

실수 : 10.34 / 23.45 / -3.14 등등

 

이런 자료형을 출력해줄 수 있는 메소드가 필요한데 그것이 바로

console 이다.

console.log(20)

 

해석해보자면 

console = 출력해줘

log = 기록해줘

20을 출력해서 기록해줘 라는 뜻이 된다.

 

숫자형은 숫자이니 만큼 다양한 산술 연산이 가능하다.

기호	설명
+	더하기
-	빼기
*	곱하기
/	나누기
%	나머지 구하기

 

 

console.log(typeof 20);

 

참고로 typeof를 붙이면 20이 어떤 자료형인지 자료의 종류에 대해서 출력해준다.

출력시 number 가 출력이 된다.

 

 

---

 

3. 문자형 (String)

문자형은 말 그래도 문자형이다.

 

문자형은 규칙이 있는데 "" '' 안에 꼭 사용해야하며 "' /  '" 이런식으로 작성할 수 없다.

따옴표안에 작성하지 않으면 문자로 인식되지 않는다.

 

console.log("이렇게 입력하거나")
console.log('이렇게 입력해야해요')
console.log("따옴표가 짝짝이면 인식하지 않아요')

 

문자형도 산술 연산이 가능하다.

console.log("대신 작성할 떄" + "이런식으로" + "작성해야하더라구요")

 

 

변수를 사용해서 작업할 수 있는데, 변수와 변수 사이에 텍스트를 넣어주는 것도 가능하다.

let apple;
apple = '사과'

let banana;
banana = '바나나'

console.log( apple + ' & ' + banana ); // 사과 & 바나나 | 문자열엔 띄어쓰기도 포함된다.

 

 

---

 

4. 템플릿리터럴 

템플릿 리터럴은  내장된 표현식을 허용하는 문자열 리터럴이다.

여러 줄로 이뤄진 문자열과 문자 보간기능을 사용할 수 있고 백틱을 사용해야한다.

`` (백틱) // 줄바꿈이 된다 

"" (큰따옴표) // 줄바꿈이 안 된다

'' (작은따옴표) // 줄바꿈이 안 된다

 

템플릿 리터럴은 변수나 상수로 선언된 데이터를 ${ } 해당 내용의 대괄호 넣어 작성할 수 있다.

  

const dog = "강아지"
const cat = "고양이"

const lovelyCat = "사랑스러운"

console.log(` ${lovelyCat} 나의 ${cat} 슈가 사랑해 ` )

 

 

${} 안에는 데이터뿐만 아니라  메소드도 넣을 수 있다.

 

const prettyPet = `${lovelyCat} ${prompt("좋아하는 동물은?")}!`

console.log(preetyPet); // 좋아하는 동물은? 이라는 내용을 가진 팝업창과 값을 입력할 수 있는 공란이 뜬다