ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [JavaScript] 3. 원시 타입, 참조타입과 연산자(할당, 비교, 동등비교, 일치비교, 논리, 삼항)
    개발 공부/Javascript 2021. 5. 10. 00:50
    개인적으로 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

    댓글

Designed by Tistory.