javascript 연산자 이해하기

javascript 연산자 이해하기

 

!!

전달 받은 인수가 Truthy 값이면 true, Falsy 값이면 false를 반환한다.

function isTruthy(v){
  return !!v;
}

function isFalsy(v){
  return !v;
}

 

단축평가  &&, ||

 

'Cat' && 'Dog' // --> 'Dog'

'Cat' || 'Dog' // --> 'Cat'


[정리]
true || anything   //true
false || anything  //anything
true && anything  //anything
false && anything  //false

[사용처]
1. 객체를 가리키기를 기대하는 변수가 null 또는 undefined가 아닌지 확인하고 프로퍼티를 참조할 때
1) 잘못된 예
var elem = null;
var value = elem.value; //TypeError: cannot read property 'value' of null
2) 올바른 예
var elem = null;
var value = elem && elem.value; //null

2.함수 매개변수에 기본값을 설정할 때
1)단축 평가를 사용한 매개변수의 기본값 설정
function getStringLength(str){
  str = str || '';
  return str.length;
}
getStringLength(); //0
getStringLength('hi'); //2

2)ES6의 매개변수의 기본값 설정
function getStringLength(str=''){
  return str.length;
}
getStringLength(); //0
getStringLength('hi'); //2

 

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

?. 는 좌항의 피연산자가 null 또는 undefined인 경우 undefined를 반환하고, 그렇지 않으면 우항의 프로퍼티 참조를 이어간다.

var stru = '';

//문자열의 길이를 참조한다. 이때 좌항 피연산자가 false를 평가되는 Falsy 값이라도
//null  또는 undefined가 아니면 우항의 프로퍼티 참조를 이어간다.
var length = str?.length;//0

 

null 병합연산자(ES11)  ??

??는 좌항의 피연산자가 null 또는 undefined인 경우 우항의 피연산자를 반환하고, 그렇지 않으면 좌항의 피연산자를 반환한다. null 병합연산자는 변수에 기본값을 설정할 때 유용하다.

//좌항의 피연산자가 null 또는 undefined이면 우항의 피연산자를 반환하고
//그렇지 않으면 좌항의 피연산자를 반환한다.
var foo = null ?? 'default string'
console.log(foo); //'default string'


//Falsy 값인 0이나 ''도 기본값으로 유효하다면 예기치 않은 동작이 발생할 수 있다.
var foo = '' || 'default string';
console.log(foo); //'default string'

//좌항의 피연산자가 Falsy 값이라도 null 또는 undefined가 아니면 좌항의 피연산자를 반환한다.
var foo = '' ?? 'default string'; 
console.log(foo); //''