[JS문법] null과 undefined

2024. 7. 13. 17:40·Frontend/JavaScript & Jquery
목차
  1. 🔎 undefind
  2.  
  3. 🔎 null

💡 null과 undefined 개념 잡기

 

"둘다 없음"을 나타내는 값이지만 정확히 따져보면 없음의 기준이 다르다!

 

🔎 undefind

: 비어있는 상태 (무시해도됨) -> 없다고 생각

사용자가 undefined을 일부러 부여하는 행위는 생각보다 많지 않은것 같다. > 직접 undefined을 할당하지 말자!!

자바스크립트 엔진이 부여하는 케이스는 존재한다.

👉 값을 대입하지 않은 변수에 접근하고자 할 때 JS 엔진이 반환해주는 값 👈

1. 값을 대입하지 않은 변수

let a;
console.log(a); // undefined

 

2. 객체 내부 존재하지 않은 프로퍼티 접근하려고 할 때

let person = {
    name : "jane",
}

person.age // undefined

 

3. return 문이 없거나 호출되지않은 함수의 실행결과

 

let arr = new Array(3);
console.log(arr); // [empty X 3]

비어있는 요소(empty)와 undefined을 할당한 요소는 엄현히 다르다고 볼 수 있음

> 비어있는 요소는 순회 대상에서 제외됨

> undefined 요소는 순회함 -> '비어있음' 의미하나 하나의 값으로 동작

 

🔎 null

: '비어있음'을 명시적으로 나타내고 싶으면 null을 쓰자!

 

🚨 null의 주의할 점 🚨

let n = null;
console.log(typeof null); // object

console.log(n == undefined); // true

console.log(n === undefined); // false

이건 JS 자체 버그이다.

null은 JS상에서 object 타입으로 인식된다.

어떤 변수의 값이 null인지 판단하기 위해서 typeof를 쓰는건 적절치 않다.

 

null과 undefined을 정확하게 비교하기 위해서는 동등equality 연산자(==) 말고, 일치identity 연산자(===)를 사용해야만 한다.

반응형
저작자표시 (새창열림)

'Frontend > JavaScript & Jquery' 카테고리의 다른 글

[JS 문법] this 바인딩에 대해서  (2) 2024.07.14
[JS 문법] JS 호이스팅에 대해서  (0) 2024.07.14
[console Tip] console 유용하게 사용하기  (0) 2024.07.10
FormData 사용하기  (1) 2023.12.06
이벤트 버블링과 캡쳐링 이해하기  (1) 2023.11.25
  1. 🔎 undefind
  2.  
  3. 🔎 null
'Frontend/JavaScript & Jquery' 카테고리의 다른 글
  • [JS 문법] this 바인딩에 대해서
  • [JS 문법] JS 호이스팅에 대해서
  • [console Tip] console 유용하게 사용하기
  • FormData 사용하기
전예방
전예방
  • 전예방
    예방이의 개발일기
    전예방
  • 전체
    오늘
    어제
    • All (125)
      • Info & Tip (2)
      • 유용한 사이트들 (5)
      • Mark Up & StyleSheet (23)
        • HTML (6)
        • CSS & SCSS (10)
        • 반응형 (6)
      • Frontend (66)
        • 전체 (10)
        • JavaScript & Jquery (18)
        • TypeScript (0)
        • React (26)
        • Next.js (3)
        • 성능최적화 (2)
        • 웹접근성 (2)
      • Backend (13)
        • Python (1)
        • JAVA (2)
        • node.js (0)
        • PHP (7)
        • 패키지매니저 (3)
      • Markdown (0)
      • SCM (1)
        • Git&Github (1)
        • SVN (0)
      • IDE (4)
        • VSCode (2)
        • IntelliJ (1)
        • Ecplise (1)
      • 취미생활 (3)
      • 정보처리기사 (2)
      • 코딩자율학습단 (5)
        • 12기 (파이썬) (5)
  • 블로그 메뉴

    • 홈
    • 태그
  • 링크

    • velog
    • github
  • 공지사항

  • 인기 글

  • 태그

    코딩자율학습
    파이썬
    frontend
    나도코딩
    Admin
    회원가입
    React Swiper
    반응형
    Chart.js
    CSS
    리액트
    NPM
    swiper.js
    TypeScript
    Python
    관리자 페이지
    php
    코딩자율학습단
    react
    yarn berry
  • 최근 댓글

  • 최근 글

  • 반응형
  • hELLO· Designed By정상우.v4.10.3
전예방
[JS문법] null과 undefined

개인정보

  • 티스토리 홈
  • 포럼
  • 로그인
상단으로

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.