[React #3] 연산자/조건문

01. 연산자

 

01) 대입 연산자 : 변수에 값을 넣을 때 사용

let a = 1;

 

 

02) 산술 연산자 : 사칙연산을 할 때 사용

let a = 1;
let b = 2;

console.log(a + b); // 3
console.log(a * b); // 2
console.log(a - b); // -1
console.log(a / b); // 0.5
console.log(a % b); // 1

 

 

03) 연결 연산자 : 두 개 이상의 문자를 연결할 때 사용

let a = "1";

let b = "2";

console.log(a + b); // 12

 

 

04) 복합 연산자 : 산술 연산자와 대입 연산자를 합쳐서 사용

let a = 5;

a += 10;

console.log(a); // 15

a -= 10;
a /= 10;
a *= 10;

 

 

05) 증감 연산자 : 값이 증가하거나 감소할 때 사용 (숫자형에만 사용 가능)

let a = 10;

a++;

console.log(a); // 11

 

• 후위 연산 : 적용된 라인 이후로 값이 바뀜

let a = 10;

console.log(a--); // 10
console.log(a); // 9

 

• 전위 연산 : 그 시점부터 바로 값이 바뀜

let a = 10;

console.log(--a); // 9
console.log(a); // 9

 

 

06) 논리 연산자 : 참이나 거짓일  때 사용

 

• ! : NOT

console.log(!true); // false

 

• && : 왼쪽과 오른쪽 피연산자가 모두 참일 때 참

console.log(true && true); // true
console.log(true && false); // false

 

• || : 왼쪽과 오른쪽 피연산자가 둘 중 하나만 참이여도 참

console.log(false || true); // true

console.log(true || false); // true

console.log(false || false); // false

 

 

07) 비교 연산자 : 값을 비교할 때 사용

 

• == : 값만 값을 때

let compareA = 1 == "1";
console.log(compareA); // true

 

• === : 값과 자료형 둘 다 같을 때

let compareA = 1 === "1";
console.log(compareA); // false

 

• != : 값이 다를 때
• !== : 값과 자료형 둘 다 다를 때

let compareA = 1 != "1";
console.log(compareA); // false

let compareB = 1 !== "1";
console.log(compareB); // true

 

• < > : 대소 비교

let compareA = 1 < 2;
console.log(compareA); // true

let compareB = 1 >= 2;
console.log(compareB); // false

 

 

08) typeof 연산자 : 자료형을 알고싶을 때 사용

let compareA = 1;

console.log(typeof compareA); // number

compareA = "1";

console.log(typeof compareA); // string

 

 

09) null 병합 연산자

• ?? : 양쪽 피연산자 중에 null이나 undefined이 아닌 값을 선택

let a;
a = a ?? 10;
console.log(a); // 10

 

 

 

02. 조건문

 

01) IF : 연산의 참,거짓에 따라서 다른 명령을 각각 실행할 수 있음

let a = 3;

if( a >= 5 ) {
	console.log("5 이상입니다.");
} else {
	console.log("5 미만입니다.");
}

// 5 미만입니다.

 

 

02) SWITCH : if와 비슷하지만 많은 조건을 간단하게 사용할 수 있음

let country = "ko";

switch(country) {
	case 'ko':
    	console.log("한국")
        break;
	case 'cn':
    	console.log("중국")
        break;
	case 'jp':
    	console.log("일본")
        break;
    default:
    	console.log("미 분류");
        break;
}

 

 

참고자료

이정환 Winterlood, '한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지'