article thumbnail image
Published 2022. 6. 28. 17:49

 

단락회로 평가란?

 

 

논리연산자의 특성을 이용한 문법이다.

논리연산자를 다시 정리해보자.

console.log(true && true);
console.log(true || false);
console.log(!true);

단락회로 평가는 왼쪽에서 오른쪽으로 연산하게 되는 논리연산자의 

연산 순서를 이용하는 문법이다.

console.log(false && true);

&& 연산자에서 앞에 값이 false면 두번째 피연산자는 볼 필요가 없다. (둘다 true가 되야하기때문)

이렇게 피연산자 중에 뒤에 위치한 피연산자는 볼 필요없이 연산을 끝내버리는것을

단락회로 평가라고 한다.

 

console.log(true || false);

or 연산자는 어떨까?

or 연산가의 경우에는 둘중에 하나만 true 여도 true를 반환한다.

앞에 값이 true 가 되어버리면 뒤에 값이 뭐가 오든 상관없으니

or 연산자에도 단락회로 평가가 일어난다고 볼 수 있다.

 

 

 

 

truthy & falsy를 단락회로 평가에 사용해보자.

 

    const getName = (person) => {
      if (!person) {
        return "객체가 아닙니다"
      }
      return person.name;
    };

    let person;
    const name = getName(person);
    console.log(name); //객체가 아닙니다.

 

위의 코드는 단락회로 평가를 사용하면 더 간략하게 쓸 수 있다.

 

    const getName = (person) => {
      return person && person.name;
    };

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

&&는 논리 연산자고 양쪽의 피연산자에 truthy && falsy한 값을 주었다.

person파라미터는 undefined라는 값을 받기때문에 person은 falsy값을 받게되고,

뒤에있는 값을 고려 할 필요가 없어진다.

그렇기때문에 person.name에는 접근하지않고 

값을 봤을때 falsy하다면  person값을 그대로 리턴하는 것이다. 

 

하지만 이렇게하면 person 자체가 반환되기때문에

출력이 undefined이나 null로 전달받으면 udefined, null이 출력된다.

 

 

그럼 그 값을 그대로 전달받지않고, 

"객체가 아닙니다' 라는 값을 반환해보자.

   const getName = (person) => {
      const name = person && person.name;
      return name || "객체가 아닙니다";
    };

    let person = null
    const name = getName(person);
    console.log(name); //객체가 아닙니다

returen을 그대로 넣어주면 값 자체가 반환되기때문에 name 상수에 담아준 다음에 name을 넣어준다.

name은 falsy한 값이고 ||연산자 뒤에 값을 보면 빈 문자열이 아니기때문에 '객체가 아닙니다'가 true로 출력되는 것이다.

 

person에 객체를 넣어보면 어떨까?

   const getName = (person) => {
      const name = person && person.name;
      return name || "객체가 아닙니다";
    };

    let person = { name : "티스토리" };
    const name = getName(person);
    console.log(name); //티스토리

 

 

로직을 자세히 살펴보면 

person 변수에는 객체가 들어있고, (객체는 truthy한 값)

person의 값도 truthy === person.name도 truthy 하기때문에

name의 값을 반환하게 된다.

name에는 결과적으로 티스토리라는 값이 저장되고,

다음 리턴을 살펴보면 name이 티스토리면 빈문자열이 아니기때문에 truthy,

truthy하기때문에 뒤에 값을 볼 필요가 없어진다.

왜냐하면? or 의 단락회로 평가는

앞에 값이 truthy하면 값을 반환하는 것으로 종료하기 때문이다.

 

 

 

반대로 falsy한 값도 넣어보자.

   const getName = (person) => {
      const name = person && person.name;
      return name || "객체가 아닙니다";
    };

    let person = null;
    const name = getName(person);
    console.log(name); //객체가 아닙니다

 

null은 falsy한 값이고 &&연산자이기때문에 뒤에 값을 볼 필요없이 falsy(null) 값을 그대로 반환한다.

name은 null이되면 falsy하게 되고, or 연산자에서는 앞에값이 falsy면 뒤에 값까지 보아야하기때문에

'객체가 아닙니다' 가 출력된다.

 

 

 

단락회로 평가는 왼쪽에서 오른쪽으로 연산하게 되는 논리연산자의 연산 순서를 이용하는 문법이다.
or 의 단락회로 평가는 앞에 값이 truthy하면 값을 반환하는 것으로 종료한다.
&& 단락회로 평가는 앞에 값이 false면 두번째 피연산자는 볼 필요없이 falsy한 값을 그대로 반환한다.

 

'개발이야기 > JS' 카테고리의 다른 글

[JS] 비 구조화 할당(구조분해 할당)  (0) 2022.06.28
[JS] 조건문 활용 (feat. 객체 괄호표기법)  (0) 2022.06.28
[JS] 삼항연산자  (0) 2022.06.28
[JS] 배열  (0) 2022.06.28
[JS] 객체  (0) 2022.06.28
복사했습니다!