<목차>
- nullish값
- ==과 ===
6. nullish값
- null과 undefined
- 값이 없음
- 확인할 때 null 병합 연산자(??), 옵셔널 체이닝 연산자(?.)등을 사용
- nullish값일 때 대체 값을 제공하거나 오류를 방지하는 용도로 활용 가능
null
- 명시적으로 값이 비어있음을 나타냄
- 개발자가 변수에 의도적으로 '비어있는' 또는 '유효하지 않은' 값이라는 것을 표시
ex) 어떤 객체를 참조할 변수가 현재 참조할 객체가 없음을 명시적으로 나타내고자 할때 null 할당
undefined
- 값이 아직 할당되지 않았거나 정의되지 않았음을 의미
- 변수를 선언했으나 값을 할당하지 않았을 때 기본적으로 할당되는 값
- 객체 내에 존재하지 않는 속성에 접근하려 할 때
**nullish coalescing operator (??)와 Optional Chaining (?.)의 차이점
Nullish Coalescing Operator (??):
이 연산자는 왼쪽 피연산자가 null 또는 undefined일 경우에만 오른쪽 피연산자의 값을 반환합니다. 그 외의 경우에는 왼쪽 피연산자의 값을 반환합니다. 이는 null이나 undefined를 처리할 때 기존의 논리 연산자 (||)와 비교할 때, 0이나 false 같은 "falsy" 값들이 유효한 값으로 처리되어야 하는 상황에서 유용하게 사용됩니다.
예: const result = value ?? "default"; 여기서 value가 null이나 undefined가 아니면 value의 값을, 그렇지 않으면 "default"를 result에 할당합니다.
Optional Chaining (?.):
이 연산자는 객체의 속성에 접근하거나 메서드를 호출할 때, 해당 객체나 속성이 null 또는 undefined이면 즉시 평가를 중단하고 undefined를 반환합니다. 이는 객체의 중첩된 속성에 안전하게 접근할 수 있도록 해주어, 객체의 속성이 정의되어 있지 않아 발생할 수 있는 오류를 방지할 수 있습니다.
예: const name = person?.name; 여기서 person 객체가 null이나 undefined이면, name은 undefined가 됩니다. 그리고 person이 존재하면 person.name의 값을 반환합니다.
요약하자면, nullish coalescing operator는 null 또는 undefined의 경우에 대한 기본값을 제공하는 반면, Optional Chaining은 객체의 속성에 안전하게 접근하기 위해 사용되어, 객체나 속성이 null 또는 undefined일 경우 평가를 즉시 중단하고 undefined를 반환합니다. 각 연산자는 자바스크립트에서 코드의 안정성을 높이고 보다 간결하게 값을 처리할 수 있게 도와줍니다.
Q. 자바스크립트의 nullish 값은 무엇이 있을까요?
자바스크립트에서 nullish값은 null과 undefined 두가지가 있습니다. 두 값 모두 "값이 없음"을 나타내지만 차이점이 있습니다. null은 명시적으로 값이 비어있음을 나타냅니다. 개발자가 변수에 의도적으로 '비어있음'또는 '유효하지 않음'이라는 것을 표시하고싶을 때 사용합니다. undefined는 값이 아직 할당되지 않았거나 정의되지 않음을 나타냅니다. 변수를 선언했으나 값을 할당하지 않았을 때 기본적으로 할당되는 값입니다. 도한 객체 내에 존재하지 않는 속성에 접근하려 할 때도 undefined가 반환됩니다. 이런 값들을 확인 할때 'null병합연산자'나 '옵셔널체이닝연산자'를 사용하여 대체값을 제공하거나 오류를 방지할 수 있습니다.
7. ==과 ===
- 값이 같은지 비교할 때 사용
===사용을 권장
동등연산자(==)
- 값이 같은지만 비교
- 타입이 다른 경우 자바스크립트 엔진이 타입을 강제로 변환하여 비교
- 타입 강제 변환
- 예상치 못한 결과를 초래할 수 있음
일치연산자(===)
- 값과 함께 타입도 같은지 비교
- 타입 변환을 하지 않고 값과 타입 둘다 일치할 때만 true 반환
- 더 엄격하고 예측 가능한 비교 제공
Q. == 과 ===의 차이점은 무엇일까요?
==과 ===은 모두 값이 같은지 비교할 때 사용하는 연산자 입니다. 하지만 두가지는 차이점을 갖고있습니다. == 즉 동등연산자는 값이 같은지 비교하는 연산자 입니다. 타입이 다른 경우 자바스크립트 엔진이 타입을 강제로 변환하여 비교하는 "타입 강제 변환" 이 이루어지기 때문에 예상치 못한 결과를 초래할 수 있습니다. 동등연산자와 비교하여 일치연산자 ===은 값과 타입을 모두 비교합니다. 타입변환을 하지 않고 값과 타입 둘다 일치할 때만 참을 반환하기 때문에 더 엄격하고 예측가능하기 때문에 일치연산자를 권장합니다.
