본문 바로가기
개발/javascript

단축 평가, 옵셔널 체이닝, 함수 인자 초기화

by 올럭Dev 2023. 11. 20.
728x90

목차 📑

연산자
개요
||
OR 연산자
&&
AND 연산자
??
null 병합 연산자
?.
옵셔널 체이닝 연산자
function (a = ‘test’)
function(인자) 초기화

|| ( OR 연산자 )

왼쪽이 falsly 값이면 오른쪽 값을 취합니다.

const or1 = "Dog" || "Cat"; // 'Dog'
const or2 = "" || "Cat"; // 'Cat'
const or3 = "Dog" || ""; // 'Dog'

&& ( AND 연산자 )

왼쪽이 falsly 값이면 왼쪽 값을 취합니다.

const and1 = "Dog" && "Cat"; // 'Cat'
const and2 = "" && "Cat"; // ''
const and3 = "Cat" && ""; // ''  

?? ( null 병합 연산자 )

왼쪽이 null 또는 undefined일 경우 오른쪽을 취합니다.
0 이나 false값이 유효한 변수인 경우 ??를 사용하여 변수 초기화하면 될 것 같습니다. (null, undefined 외에 다른 falsly 값으로 초기화 하려면 ||를 사용하면 될 것 같네요)

const a = null;
const b = undefined;  

const null1 = a ?? false; // false
const null2 = b ?? false; // false
const null3 = "" ?? false; // ''  

?. (옵셔널 체이닝 연산자)

왼쪽이 null 또는 undefined인 경우 undefined를 반환합니다.
왼쪽이 null과 undefined가 아닌 경우 우측의 프로퍼티 참조를 이어갑니다.

const a = null;
const b = undefined;   

const op1 = a?.length; // undefined
const op2 = b?.length; // undefined
const op3 = ""?.length; // 0
const op4 = []?.length; // 0   

function(인자) 초기화

인자가 undefined인 경우에만 초기화 값이 적용됩니다.

function test(a = 'test'){
console.log(a)
}

test() // 'test'
test(null) // null
test(undefined) // 'test'

마치며 🍺

단축 평가, 변수 초기화 부분이 간혹가다 헷갈렸어서 간단하게 정리해 보았습니다.
도움이 되었으면 좋겠네요!!

함께하면 좋은 글 😍

728x90