[JS] || 기능 살펴보기, 참과 거짓을 판단하는 게 아니다

 

📑 논리연산자 ||

 

다른 언어에서 보통 ||는 &&와 같이 쓰이는 논리연산자이다. 나도 그렇게만 생각하고 있었는데 JS에서 다릏게 쓰이는 걸 봤다. 

 

const n1 = 1, n2 = 2;

if (n1===1 && n2===2) {
	console.log("n1은 1이고 n2는 2이다.");
}

 

 

📑 그렇다면 어떤 기능이? 피연산자 중 하나를 반환한다. 

 

자바스크립트에서 논리 연산자는 단순히 참과 거짓을 판단해주는 연산자가 아니라 연산에 사용된 피 연산자 중 하나를 반환해주는 연산에 불과하다. 

 

const n1 = true;
3 || 4     // 3
n1 || 8    // true
false || 4 // 4
0 || 9     // 9

 

||연산자는 피 연산자로 정수가 오는 경우 Boolean 으로 암묵적 형 변환이 이뤄진다. 0이 아닌 정수는 true로 판단하기 때문에 3 || 4에서 true인 3이 출력된다. 

 

var obj = { };

if (obj) {
	console.log("obj 가 존재하잖아?");
}

 

위의 문장에서는 obj의 값이 없다. 객체의 경우 true로 형변환이 되고, 만약에 값이 할당되어 있지 않으면 undefined가 들어가며, undefined는 false 형태로 형변환이 된다. 

 

 

📑 논리 연산자 활용하기

 

보통 매개변수 디폴트 할당에 쓰인다. 

만약 num의 값이 지정되어 있지 않다면. 값은 99로 설정하고, 만약 값이 있다면 들어온 값을 true로 판별하기 때문에 매개변수로 들어온 값을 출력한다. 

 

function foo(num) {
	const n = num || 99; //만약 num값이 들어오지 않는다면, undefined가 됩니다.
	console.log(n);
}

foo(3); // 3
foo();  // 99

 

내가 이 문법을 검색하게 된 이유도 아래와 같다. 만약 사용자가 페이지를 클릭하지 않으면 그냥 1페이지 목록을 보여주게 되는 것이고 사용자가 2페이지로 넘어가려고 클릭하면 clickpagenum에 2가 들어가고, 이는 true로 형변환 되어 첫 번째 값인 clickpagenum이 객체에 담기게 된다. 

 

function fListfileupload(clickpagenum) {
		
		//clickpagenum 얘를 찾을 수 없으면 1을 넘겨줘. 
		//만약 값이 있으면 넘어온 값을 넘겨주고. 
		//여기서 clickpagenum는 페이지 번호이다. (12345) 이런식으로 클릭할 수 있는
		clickpagenum = clickpagenum || 1;
        }