단축 평가 논리 계산법

 

&&

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

- &&연산자의 경우, 앞에 오는 값이 true면 뒤에 오는 값이 결과물

- &&연산자의 경우, 앞에 오는 값이 falsy한 값이면 앞에 있는 값이 결과물

 

 

보통 이럴 때 활용된다. 

 

const object = { name: 'asdf' };

// object의 name에 아무런 값이 없을시, 에러가 뜨는데 이를 막기 위해서
// 이렇게 &&를 쓰면 undefined뜸
// object의 name이 있다면 name이 뜬다
const name = object && object.name;

console.log(name);

 

 object의 name에 아무런 값이 없을시, 에러가 뜨는데 이를 막기 위해서
이렇게 &&를 쓰면 undefined뜸
object의 name이 있다면 name이 뜬다

 

---

|| 연산자

const namelessDog = {
  name: ""
};

function getName(animal) {
  const name = animal && animal.name;

  if (!name) {
    return "이름이 없는 동물입니다";
  }

  return name;
}

const name = getName(namelessDog);

console.log(name);

위 코드를 or연산자를 사용하면 이렇게 단축할 수 있다.

 

const namelessDog = {
  name: ""
};

function getName(animal) {
  const name = animal && animal.name;

  return name || "이름이 없는 동물입니다.";
}

const name = getName(namelessDog);

console.log(name);

 

 

console.log(false || "hello");
console.log("" || "이름없다");
console.log(null || "널이다~");
console.log(undefined || "defined 되지 않았다!");
console.log(0 || "제로다");
console.log(1 || "음?");
console.log(true || "여기 안본다.");
console.log("와아" || "여기 안봐요");
console.log([] || "노노!");

 

- 앞에 있는 값이 falsy한 값일 경우 뒤를 무조건 출력하고

- 앞에 있는 값이 truthy한 경우 앞에 있는 값을 무조건 출력함

- or 연산자는 주로 어떠한 값이 없을때 기본 값을 출력할 때 유용함.