자바스크립트의 논리 연산자(Logical operators)

Bien·2022년 3월 3일
0

논리 연산자(Logical operators)

1. OR : ||

||(or)은 하나라도 true인 경우 true를 반환한다. 첫번째 true를 찾으면 연산을 멈춘다.

const value1 = false;
const value2 = 10 < 2;

console.log(`or:${value1 || value2 || check()}`);

function check() {
  for (let i = 0; i < 10; i++) {
    console.log('hello');
  }
  return true; //의미 없는 함수 결국 true를 리턴한다.
}

콘솔창에는 hello 10개와 or:true 가 찍힌다.

const value1 = true;
const value2 = 10 < 2;

console.log(`or:${value1 || value2 || check()}`);

function check() {
  for (let i = 0; i < 10; i++) {
    console.log('hello');
  }
  return true; //의미 없는 함수 결국 true를 리턴한다.
}

콘솔창에는 or:true만 찍힌다. value1이 true기 때문에 이미 true로 끝난다.

🧐 더 좋은코드를 생각해보자.

const value1 = true;
const value2 = 10 < 2;

console.log(`or:${value1 || value2 || check()}`);

function check() {
  for (let i = 0; i < 10; i++) {
    console.log('hello');
  }
  return true; 
}
const value1 = true;
const value2 = 10 < 2;

console.log(`or:${check() || value1 || value2}`);

function check() {
  for (let i = 0; i < 10; i++) {
    console.log('hello');
  }
  return true; 
}

위 두개의 코드는 둘 다 콘솔에 or:true가 찍힌다. 그러나 후자보다 전자가 더 좋은 코드이다. check()같은 함수는 뒤에 배치하는것이 좋다.

2. AND : &&

&&(and) 은 하나라도 false인 경우 false를 반환한다. 첫번째 false를 찾으면 연산을 멈춘다. 모두 true인 경우에만 true를 리턴한다.

const value1 = false;
const value2 = 10 < 2;

console.log(`and:${value1 && value2 && check()}`);

function check() {
  for (let i = 0; i < 10; i++) {
    console.log('hello');
  }
  return true;
}

value1이 false라 콘솔에 and:false가 찍힌다.

const value1 = true;
const value2 = 10 < 20;

console.log(`and:${value1 && value2 && check()}`);

function check() {
  for (let i = 0; i < 10; i++) {
    console.log('hello');
  }
  return true;
}

이렇게 모든 연산이 true인 경우에만 콘솔에 and:true가 나온다. and 연산자 역시 가장 앞에 false 이면 더 이상 연산하지 않고 false를 반환하기 때문에 복잡한 연산은 가장 뒤에 배치하자!

🧐 &&(and)연산자의 또 다른 쓰임

간편한 null 체크

// nullableObject이게 null이면 false라 nullableObject.something 실행하지 않음
nullableObject && nullableObject.something

이 코드를 풀어서 쓰면

if(nullableObject != null){
  nullableObject.something;
}

이렇게 길어진다.

3. ! : not

값을 반대로 바꿔준다. false-> true, true->false

profile
🙀

0개의 댓글