단축 평가 논리 계산법

hongcoder·2020년 9월 3일
0

Front-end

목록 보기
6/12

단축 평가 논리 계산법

단축 평기 논리 계산법은 이름이 길고 듣기만해도 복잡해보이는데

내용자체는 굉장히 쉽다.

바로 논리연산자를 이용하여 코드를 단축시키는 것을 뜻한다.

true && true // true
true && false // false
true || false // true
false || true // true

&&연산자는 쉽게 말해서

1.둘 다 참값이면 뒤의 true값이 리턴된다.
2.둘 다 거짓값일 때, 먼저의 거짓값이 리턴된다.
3.참과 거짓값이 같이 나오면 거짓값을 리턴된다.

||연산자는

1.둘 다 참값이면 먼저 있는 참값이 리턴된다.
2.둘 다 거짓값이면 나중의 거짓값이 리턴된다.
3.참과 거짓값이 동시에 나오면 참값을 리턴한다.

console.log(true && 'hello'); // hello
console.log(false && 'hello'); // false
console.log('hello' && 'bye'); // bye
console.log(null && 'hello'); // null
console.log(undefined && 'hello'); // undefined
console.log('' && 'hello'); // ''
console.log(0 && 'hello'); // 0
console.log(1 && 'hello'); // hello
console.log(1 && 1); // 1

이제 위의 연산자를 통해 코드를 단축시키는 과정을 보자.

const coffee = {
    name: '라떼' 
    };
    
function getName(beverage){
	return beverage.name
}

const name = getName(coffee);
console.log(name); // 라떼

여기서 getName의 파라미터에 제대로 된 객체값이 없다면

const coffee = {
    name: '라떼' 
    };
    
function getName(beverage){
	return beverage.name
}

const name = getName();
console.log(name); //error: property name of undefined;

beverage객체가 undefined라서, undefined.name값을 조회할 수 없기에 이런 에러가 나온다.

함수에서 beverage값이 제대로 주어졌을 때에만 name을 조회하고 그렇지 않았을 경우 undefined를 출력하고 싶다면

const coffee = {
    name: '라떼' 
    };
    
function getName(beverage){
	if(beverage) {
	return beverage.name
   }
   return undefined;
}

const name = getName();
console.log(name); 

위와 같이 else값을 undefined값을 설정하면 에러가 발생하지않는다.
이 코드를 단축 평가 논리 계산법으로 단축해보면

const coffee = {
    name: '라떼' 
    };
    
function getName(beverage){
	return beverage && beverage.name;
}

const name = getName();
console.log(name);  //undefined

이처럼 a && b 연산자에서 a값이 truth하면, b가 결과값이 된다.
반대로 a가 falsy값이면 결과는 a가 된다.

||연산자의 예를 한번 들어보자.

const coffee = {
	name: "라떼"
};

function getName(beverage) {
    if(!beverage) {
	return '이름이 없는 음료입니다.';
    }
   return beverage;
 }
   const name = getName(coffee);
   
   console.log(name) //{name: 라떼}
   

위 코드를 ||연산자로 이용하면

const coffee = {
	name: "라떼"
};

function getName(beverage) {
	return beverage || '이름이 없는 음료입니다.';
 }
   const name = getName(coffee);
   console.log(name) //{name: 라떼}
   
   const name2 = getName()
   console.log(name) // '이름이 없는 음료입니다.'
   

참고 https://learnjs.vlpt.us/useful/03-short-circuiting.html

profile
기록하지 않으면 기억되지않음🧐

0개의 댓글