자바스크립트 개발자라면 알아야 할 Concept 33 [#2. Primitive Types]

미음제

·

2020. 11. 6. 00:06

노마드 코더 유튜브를 통해 자바스크립트를 공부하려고 동영상을 찾아보던 중 흥미를 끈 동영상이 있었다.

 

"자바스크립트 개발자라면 알아야하는 핵심 컨셉 33개"

33개의 개념은 다른 개발자가 Github에 올려준 내용을 바탕으로 한다. [https://github.com/yjs03057/33-js-concepts]

 

직접 번역해서 공부하고 싶지만, 노마드가 친절하게 설명해주고 있기에 노마드의 영상을 보고 공부하고 이해하고자 한다.

 

 

 


 

Primitive Types

primitive는 '원시적인', '기초적인'이라는 뜻을 가진 단어다. primitive types은 원시적인 타입, 기초적인 타입이 되겠다.

자바스크립트에서 primitive types은 다음과 같다

 

  • String
  • Number
  • Boolean
  • null
  • Undefined
  • NaN

String

String, 문자열이다. String은 "", ''으로 작성된다.

 

"hello"
'hello'

콘솔 창에 위처럼 입력하면

 

문자열을 반환해준다.

 

 

String, 문자열의 규칙은 반드시 같은 모양새의 따옴표로 시작해서 끝나야 한다는 것이다.

"hi", 'hi' 처럼

 

아래 코드처럼 작성을 하게 되면, 당연히

"hi'
'hi"
"hi
hi"

 

이 처럼 에러가 발생한다.

 

 

 

문장을 작성할 때, 다음과 같이 작성을 하게되면

"They call me "awesome man""

awesom man을 변수명으로 인식하게 된다. 당연히 에러 발생

 

 

 

They call me "awesom man"으로 출력하고 싶다면

"They call me \"awesome man\""

으로 작성하면 된다


Number

Number는 말 그대로 숫자, Int와 Float가 있다.

 

1234, 564156와 같은 정수

13.5, 122.15와 같은 실수

 

 


Boolean

Boolean의 값은 true와 false

 

Boolean은 사용할 때, 따옴표를 사용하면 안 된다.당연히 따옴표를 사용하면 문자열로 인식된다.

"true"
"false"

true
false


Undefined, null

 

Undefined는 "정의가 되지 않음"

null은 "존재하지 않음"

 

 

A라는 변수를 선언하고, A를 호출하면

let A;

A;

A는 정의되지 않았다고 출력한다.

console.log(A === undefined)

A가 undefined이냐고 물어보면 당연히 true를 반환한다.

A는 "정의를 하지 않은 것"

 

 

 

그렇다면 null이냐고 물어보면?

console.log(A === null)

 

false를 반환한다.

null은 아니고 undefined이다.

 

 

무슨 소리인가?

변수 A는 String, Number, Boolean 등은 아니지만,

정의되지 않았을 뿐 null은 아니라는 것이다.

즉, "존재하지 않는 것"은 아니다 "정의만 되지 않았을 뿐"

 

 

만약 A라는 변수를

let A = null;

null이라고 선언한다면,

A는 null이라는 값을 갖는 변수가 된다.

 

즉, A는 "존재하지 않음"이라는 값을 갖고 있는 변수가 된다.

 

 

Undefined과 null은 엄연히 다르다. 

 


NaN

처음 들어본 용어였다. 

NaN은 Not A Number의 약자이다.

수학 공식에서 등장하는 타입으로, 

수학 공식에 NaN가 등장하면

그 공식은 망한 것이라고 보면 된다.

 

 

 

 

다음과 같은 코드를 입력하면

Math.pow(3, "hi")

공식은 3^hi, 3을 hi 제곱하라는 소리가 된다.

말이 안 되는 공식이라 NaN가 나오는 것이다.

 

마찬가지로 아래 코드처럼 작성하게 된다면

5/"HI"

결과는 NaN이 출력된다.


Type을 알아내는 방법?

typeof keyword를 입력해주면 된다.

 

반응형