개인적으로 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