[javascript] 연산자 정리, 조건문(if, switch), 반복문(while,for)

1. 글자 합치기

console.log('hi' + ' code');
// hi code

console.log('1' + 2);
// 12

console.log(`string literals: 1 + 2 = ${1 + 2}`);
// string literals: 1 + 2 = 3

 

 

2. 숫자 연산자

console.log(1 + 1);
console.log(1 - 1);
console.log(1 / 1);
console.log(1 * 1);
console.log(5 % 2);
// 나눈 뒤 나머지 값
console.log(2 ** 3);
// 2의 3승

 

 

3. 증감 연산자

let i = 2;

const preIncrement = ++i;
// 위는 i = i + 1; 과 같음
// preIncrement = i;
// preIncrement에 값을 할당하기 전 i를 증가 시킴

console.log(${preIncrement}, ${i});
// 3 , 3

const postIncrement = i++;
// postIncrement = i;
// i = i + 1;
// postIncrement에 값을 할당한 다음 i를 증가 시킴

console.log(${postIncrement}, ${i});
// 3 , 4


// 감소
const preIncrement = --i;
const postIncrement = i--;

 

 

4. 할당 연산자

let x = 3;
let y = 6;

x += y;
// x = x + y;
x -= y;
x *= y;
x /= y;

 

 

5. 비교 연산자

console.log(10 < 6);
console.log(10 <= 6);
console.log(10 > 6);
console.log(10 >= 6);

 

 

6. 논리 연산자 (||, &&, !)

 

|| (or)

하나라도 true면 true를 반환함

true가 나오면 더 이상 계산하지 않고 거기서 멈춤

가벼운 값에서 무거운 값(함수) 순으로 적어주는 것이 좋음

const value1 = false;
const value2 = 4 < 2;
// false

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

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

 

&& (and)

모두가 true면 true를 반환함

하나라도 false가 나오면 더 이상 계산하지 않고 거기서 멈춤

가벼운 값에서 무거운 값(함수) 순으로 적어주는 것이 좋음

null값을 확인할 때 자주 쓰임

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

 

! (not)

 

값을 반대로 바꿔줌

true면 false를 반환

false면 true를 반환

console.log(!value);

 

 

7. 동등 연산자 (Equality)

 

== (loose equality)

숫자 타입, 문자 타입 상관없이 값이 같으면 true를 반환함

 

!=

두 값이 같지 않을 경우 true를 반환함

 

=== (strict equality)

값과 타입까지 같아야 true를 반환함

웬만하면 이걸 쓰는 게 좋음!

 

!==

두 값과 타입이 같지 않을 경우 true를 반환함

 

console.log(0 == false);
// true. 0과 null, undefined와 같은 empty string은 false로 간주될 수 있다.
console.log(0 === false);
// false. 0은 불리언타입이 아님
console.log('' == false);
// true.
console.log('' === false);
// false. 불리언타입이 아님
console.log(null == undefined);
// ture.
console.log(null === undefined);
// false. 타입이 다름

 

 

8. 조건문

 

if

const name = 'hi'

if (name === 'hi') {
	console.log('hi hi!');
    // name이 hi라면 위 코드를 실행
} else if (name === 'happy') {
	console.log('hi happy!');
    // hi가 아니고 happy라면 위 코드를 실행
} else {
	console.log('unkwnon');
    // hi도 happy도 아니라면 위 코드를 실행
}

 

 

조건부 연산자 ? : (삼항 연산자)

 

값을 할당하거나 간단하게 출력할 때 자주 쓰임

복잡하게 계속 묶어서 사용하면 가독성이 떨어지므로 그럴 땐 if를 사용!

// condition ? value1 : value2;
console.log(name === 'hi' ? 'yes' : 'no');
// name이 hi면 yes를 출력하고 아니라면 no를 출력

let value = condition1 ? 'condition1이 참' : (condition2 ? 'condition2가 참' : '둘 다 거짓');
// 조건이 한 번 더 들어갈 경우 가독성을 위해 소괄호로 묶어주는 것이 좋음

name === 'hi' ? 'yes' : 'no'

조건 ? 참일 경우 : 거짓일 경우

condition1 ? 'condition1이 참' : (condition2 ? 'condition2가 참' : '둘 다 거짓');

 

 

switch

 

if가 길어지면 대체하기 좋음

타입 스크립트에서 정해진 타입을 검사할 때 쓰면 가독성이 좋음

const name = 'hi';

switch (name) {
	case 'hi':
    	console.log('111');
        break;
    // name이 hi면 111을 출력하고 멈춤
    
    case 'happy':
    case 'code':
    	console.log('222');
    // 결과값이 같을 땐 묶어서 사용도 가능
    break;
    
    default:
    // 이것도 저것도 아닐 때 = else와 같음
    	console.log('333');
        break;
}

조건문 다음에 break를 쓰지 않으면 조건문이 true일 때 그 뒤 나머지 조건문들도 실행이 됨

 

 

9. 반복문

 

whlie loop

 

false가 나오기 전까지 무한대로 반복함

break를 쓰면 조건이 참일 때 멈추게 할 수 있음

countiue로 특정 조건(부분)을 건너뛰게 할 수 있음

let i = 3;

while (i > 0) {
    console.log('while: ${i}');
    i--;
}
// i가 0보다 클 경우 i를 출력한 뒤 i를 감소시킨다
// i가 0보다 작아질 경우 루프가 멈춤

// 결과값
// while: 3
// while: 2
// while: 1


//break

let i = 0;

while(true){
  if(i === 5) break;
  i++;
}
// 무한 반복문의 형태지만 break로 조건이 참일 때 멈추게 할 수 있음

// countiue

let i = 0;

while(i < 10){
  i++;
  if(i % 2 === 0){ // 짝수는
    countiue; // 건너뛰어라
  }
  console.log(i);
}
// 1부터 9까지 홀수만 출력됨

let i = 3; - 시작
while (i > 0) - 조건식 {
console.log('while: ${i}'); - 동작문
    i--; - 종료식
}

 

 

do-while loop

 

블럭을 먼저 실행해서 출력한 뒤 조건을 검사함

// i는 현재 0

do {
    console.log('do while: ${i}');
    i--;
} while (i > 0)

// 결과값
// do while: 0
// i가 0보다 크지 않으므로 멈춤

 

 

for loop

 

for (①시작; ②조건식; ④종료식;){

  ③동작문

}

* 번호는 실행 순서(시작은 처음 한 번만 실행, 조건이 참인 동안 ②③④ 반복)

// for (begin; condition; step)
// begin은 한번만 실행됨

for(i = 3; i > 0; i--) {
	console.log('${i}');
}
// i는 3, i가 0보다 크다면 i를 출력하고 감소 시킨 뒤 반복
// i가 0보다 작으면 멈춤

// 결과값
// 3
// 2
// 1

// 블럭내에 지역변수 설정
// inline variable declaration

for (ler i = 3; i > 0; i = i-2) {
	console.log('${i}');
}

실수로 무한 반복문을 실행 했을 경우 shift+esc를 눌러 브라우저관리자에서 브라우저를 종료하면 됨

 

 

14. 중첩 반복문

 

for문 안에 for문

cpu에 좋지 않아서 사용하지 않는 게 좋음

 

반복문은 노트에 결과값을 적어보며 공부하는 것이 좋다!!!!!!!!!!!!!!!!!!!!!!!!