📚 && 논리 연산자로 if문 단축하기

&& 연산자 조건문 표현

자바스크립트의 &&(AND) 연산자는 양쪽 피연산자가 모두 true일 때 true를 반환하고, 그렇지 않을 때는 false를 반환한다. 이 특성을 이용하여 자바스크립트의 if문을 한줄로 단축시킬 수 있다.

if (num !== 0) {
  console.log('num is not zero');
}

num !== 0 && console.log('num is not zero'); // if를 없애고 && 연산자로 한줄로 단축

num === 0 || console.log('num is not zero'); // || OR 연산자로도 가능하다. 이때는 첫번째 식이 false 일때만 다음 식이 실행된다

---

&& 연산자 와 (소괄호) 표현

그런데 만일 console.log() 와 같은 함수 호출이 아닌, 연산식 코드가 있을 경우, 위와 같이 단축해 버리면 에러가 발생한다. 이때는 소괄호를 써서 표현식을 코드 실행식으로 처리하여야 한다.

let x = 1;
if(x==1) {
	x=10;
}
console.log(x); // 10

let x = 1;
x==1 && (x=10); // 단축
console.log(x); // 10

만일 여러 줄 일 경우, 콤마 연산자와 결합하면 여러줄을 한줄로 한방에 표현할수 있다.

let x = 10, y, z;

if(x==10) {
    y = 100;
    z = x ** y;
    z++;
    x = z;
}

console.log(x); // 1e+100

let x = 10, y, z;

x==10 && (y = 100, z = x ** y, z++, x = z)

console.log(x); // 1e+100

 

 

이처럼 && 연산자를 이용하여 if문을 단축시키는 방법은 코드를 간결하게 만들 수 있지만, 몇몇 사람들은 오히려 익숙치 않은 문법에 때문에 오히려 가독성이 떨어진다고들 하여 이견이 많다. 따라서 코드의 간결함만을 추구하기 보다는, 코드의 의미를 명확하게 전달할 수 있도록 작성하는 것이 중요하다.