[JavaScript] 3. 원시 타입, 참조타입과 연산자(할당, 비교, 동등비교, 일치비교, 논리, 삼항)

개인적으로 JavaScript를 공부하고 그 흔적을 남기는 곳입니다.

 

 

1. 원시 타입 (Primitive Type)

• 객체(object)가 아닌 기본 타입들을 말한다.
• 변수에 해당 타입의 값이 담긴다고 생각하면 된다.
• 다른 변수에 복사할 때 실제로 값이 복사된다.

1-1) 숫자 (Number)

• 정수, 실수 구분없는 하나의 숫자 타입
• 부동소수점 형식을 따른다.
• NaN (Not a Number) : 계산 불가능할 경우 반환되는 값을 지칭 (문자열을 숫자로 나누는 경우 등)

const a = 10 // 양의 정수
const b = -5 // 음의 정수
const c = 1.05 // 실수
const d = 3.118e3 // 거듭제곱
const e = Infinity // 양의 무한대
const f = -Infinity // 음의 무한대
const g = NaN // 산술 연산 불가

 

1-2) 문자열 (String)

• 텍스트 데이터를 나타내는 타입
• 16비트 유니코드 문자의 집합
• 작은따옴표와 큰따옴표 모두 사용 가능하다.
• 템플릿 리터럴 (Template Literal) : ES6부터 지원하며, 파이썬의 f-string과 비슷한 역할을 한다. 따옴표 대신 backtick(``)으로 표현하며, ${변수} 형태로 변수의 값을 문자열에 직접 넣을 수 있다.

const firstName = 'kyle'
const lastName = 'Kim'
const fullName = firstName + lastName // kyleKim

const firstName = 'kyle'
const lastName = 'Kim'
const fullName = `${firstName} ${lastName}` // kyle Kim

 

1-3) undefined

• 변수의 값이 없음을 나타내는 데이터 타입
• 변수 선언 이후 직접 값을 할당하지 않으면 자동으로 undefined가 할당된다.

let firstName
console.log(firstName) // undefined

 

1-4) null

• 변수의 값이 없음을 의도적으로 표현할 때 사용하는 데이터 타입
• undefined와 동일하지만, null은 해당 값이 없다는 것을 좀 더 명시적으로 나타낼 때 사용한다.
• null 타입은 특이하게도 typeof 연산자를 통해 확인해보면 객체(object)라고 찍힌다.
• ECMA의 명세에 따르면 null은 primitive type(원시타입)으로 분류되지만, typeof로 찍어봤을 때는 object라고 뜨니 이 점을 유의하자.

let firstName = null
console.log(firstName) // null

typeof undefined // undefined
typeof null // object

 

1-5) 불리언 (Boolean)

• 논리적인 참/거짓을 나타내는 타입
• true 혹은 false로 표현된다.
• 조건문 또는 반복문에서 유용하게 사용된다.
• (파이썬과 비슷하게, Boolean이 아닌 데이터 타입을 조건문이나 반복문에서 사용하는 경우 자동 형변환에 따라 true 혹은 false로 변환된다.)

ECMA 명세에 정리된 자동 형변환 규칙

let isAdmin = true
console.log(isAdmin) // true

isAdmin = false
console.log(isAdmin) // false

 

2. 참조 타입 (Reference Type)

• 객체(object) 타입의 자료형들을 말한다.
• 변수에 해당 객체의 참조 값이 담긴다고 생각하면 된다.
• 다른 변수에 복사할 때 참조 값이 복사된다.
• 함수(Function), 배열(Array), 객체(Object) 타입이 있다. 추후 게시물들에서 하나씩 자세하게 알아보겠다.

 

---

 

3. 연산자

3-1) 할당 연산자

• 오른쪽에 있는 피연산자의 평가 결과를 왼쪽 피연산자에 할당하는 연산자
• 에어비앤비 코딩 스타일 가이드에서는 ++나 --보다는 += 1 혹은 -= 1과 같이 분명하게 적을 것을 권장한다.

let x = 0

x += 10 // x = x + 10
x -= 3 // x = x - 3
x *= 10 // x = x * 10
x /= 10 // x = x / 10

x++ // x = x + 1 또는 x += 1
x-- // x = x - 1 또는 x -= 1

 

3-2) 비교 연산자

• 피연산자들을 비교하고 비교의 결과값을 Boolean으로 반환하는 연산자
• 문자열의 대소비교는 유니코드 값을 사용하여 표준 사전순서를 비교한다.

const one = 1
const two = 2
console.log(one < two) // true

const a = 'a'
const z = 'z'
console.log(a > z) // false

 

3-3) 동등 비교 연산자(==)와 일치 비교 연산자(===)

• 동등 비교 연산자(==)
  • 두 피연산자가 같은 값으로 평가되는지 비교 후 Boolean 값을 반환
  • 비교 시, 암묵적 타입 변환을 통해 타입을 일치시킨 다음에 같은 값인지 비교한다.
  • 피연산자가 모두 객체 타입일 경우, 메모리의 같은 객체를 가리키는지 판별한다.
  • 특이한 경우를 제외하고는 ===을 사용하기를 권장!!!

 

• 일치 비교 연산자(===)
  • 두 피연산자가 완벽하게 같은 값으로 평가되는지 비교 후 Boolean 값을 반환
  • 엄격하게 비교가 이루어진다. (타입과 값 모두가 같은지 비교)
  • 피연산자가 모두 객체 타입일 경우, 메모리의 같은 객체를 가리키는지 판별한다.

const a = 1
const b = '1'
console.log(a == b) // true
console.log(a === b) // false

const c = 1
const d = true
console.log(c == d) // true
console.log(c === d) // false

 

3-4) 논리 연산자

• and 연산은 && 을 이용한다.
• or 연산은 || 을 이용한다.
• not 연산은 ! 을 이용한다.
• 단축 평가를 지원하여, 앞 피연산자만 판별해도 전체 참/거짓이 판별되는 경우, 뒤 피연산자는 보지도 않는다.
  예) false && true => false

 

3-5) 삼항 연산자

• 세 개의 피연산자를 사용하여 조건에 따라 값을 반환
• 조건식이 참이면 : 의 왼쪽 값을, 거짓이면 : 의 오른쪽 값을 사용한다.

console.log(true ? 1 : 2) // 1
console.log(false ? 1 : 2) // 2

const result = Math.PI > 4 ? 'YES' : 'NO'
console.log(result) // NO