JavaScript 문법 종합 1주차(조건문, 반복문)

조건문(if, else if, else, switch)

if문

if (조건) {
  // main logic
}

let x = 10;

if (x > 0) {
  console.log("x는 양수입니다.");
}  // x는 양수입니다.

 

if-else문

if-else문은 조건이 참인 경우와 거짓인 경우 각각 다른 코드를 실행한다.

let x = 10;

if (x > 0) {
  console.log("x는 양수입니다.");
} else {
  console.log("x는 음수입니다.");
} // x는 양수입니다.

 

if-else if-else문

if-else if-else문은 여러 개의 조건을 순서대로 비교하여, 해당하는 조건에 맞는 코드를 실행한다.

if (조건1) {
  // main logic #1
} else if (조건2) {
  // main logic #2
} else {
  // main logic #3
}

let x = 0;

if (x > 0) {
  console.log("x는 양수입니다.");
} else if (x < 0) {
  console.log("x는 음수입니다.");
} else {
  console.log("x는 0입니다.");
} // x는 0입니다.

 

switch문

witch문은 변수의 값에 따라 여러 개의 경우(case) 중 하나를 선택하여 해당하는 코드를 실행한다. default는 모든 경우에 맞지 않는 경우에 실행되는 코드를 작성한다.

let fruit = "사과";

switch (fruit) {
  case "사과":
    console.log("사과입니다.");
    break;
  case "바나나":
    console.log("바나나입니다.");
    break;
  case "키위":
    console.log("키위입니다.");
    break;
  default:
    console.log("아무것도 아닙니다.");
    break;
} // 사과입니다.

// break를 넣어줌으로써 그 조건에 해당해 결과를 낸 후 빠져나올 수 있게 함

https://ko.javascript.info/switch

 

조건문의 중첩

조건문 안에 또 다른 조건문을 사용하여 복잡한 조건을 판별할 수 있다.

let age = 15;
let gender = "남성";

// 성별과 미성년자 구분
if (age >= 18) {
    if (gender === "여성") {
    	console.log("성인 여성입니다.")
    } else {
    	console.log("성인 남성입니다.")
    }
} else {
    if (gender === "여성") {
        console.log("미성년 여성입니다.")
    } else {
        console.log("미성년 남성입니다.")
    }
} // 미성년 남성입니다.

 

조건부 실행

&& 연산자를 사용하여 조건부 실행을 할 수 있다.

let x = 10;

if (x > 0) {
    console.log("x는 양수입니다.");
}

// 서로 같다

(x > 0) && console.log("x는 양수입니다.")
// and조건(&&)
// x > 0 이 true면, console.log("x는 양수입니다.")를 실행

 

삼항 연산자와 단축 평가

|| 연산자를 사용하여 단축 평가(short-circuit evaluation)를 할 수 있습니다.

let y; // y는 선언만 하고 할당은 하지 않음(undefined)
let z = y || 20; // y가 undefined면 기본 값으로 우측에 있는 값(20)을 설정해줘
console.log(z);

// or조건(||)
// 20

 

falsy한 값과 truthy한 값

조건문으로 사용할 수 있는 값들에는 무엇이 있는지, falsy한 값들을 사용해 if문의 조건을 만족시키지 못한다.

0, 빈 문자열, null, undefined, NaN, false는 falsy한 값으로, if문의 조건을 만족시키지 못한다.

그 외의 값들은 모두 truthy한 값으로, if문의 조건을 만족시킵니다.

if (0) {
    console.log("hello");
}

if ("") {
    console.log("hello");
}

if (null) {
    console.log("hello");
}

if (undefined) {
    console.log("hello");
}

if (NaN) {
    console.log("hello");
}

if (false) {
    console.log("hello");
}

if (true) {
    console.log("hello");
} 

// 맨 마지막을 제외하고 모두 출력되지 않는다.

---

반복문(for, while)

for문

for (초기값; 조건식; 증감식) {

}

for (let i = 0; i < 5; i++) {
  console.log("FOR문 돌아가고 있음 => "+ i);
}

// i라는 변수는 0부터 시작할거야
// i라는 변수가 5에 도달하기 전까지 계속할거야
// i라는 변수는 한 사이클 { }이 돌고 나면 1을 더할거야
// i가 10에 도달하면 for문은 끝남

// FOR문 돌아가고 있음 => 0
// FOR문 돌아가고 있음 => 1
// FOR문 돌아가고 있음 => 2
// FOR문 돌아가고 있음 => 3
// FOR문 돌아가고 있음 => 4

 

배열과 함께 사용하는 for문

배열의 요소 개수만큼 반복하여 실행다.

const arr = ["one", "two", "three", "four", "five"];
for (let i = 0; i < arr.length; i++) {
    console.log(i);
    console.log(arr[1]);
}

// 0
// one
// 1
// two
// 2
// three
// 3
// four
// 4
// five

// 0부터 10까지 수 중에서 2의 배수만 console.log로 출력

for (let i = 0; i < 11; i++) {
    if (i >= 2) {
        if (i % 2 === 0) {
        console.log(i + "는 2의 배수입니다.");
        }
    }
}

// 2는 2의 배수입니다.
// 4는 2의 배수입니다.
// 6는 2의 배수입니다.
// 8는 2의 배수입니다.
// 10는 2의 배수입니다.

 

for...in문

객체의 속성을 출력하는 문법으로, for...in문을 사용해 객체의 프로퍼티를 순서대로 접근할 수 있다.

let person = { 
    name: "John", 
    age: 30, 
    gender: "male" 
};

// person['key']_의 방식으로도 value에 접근할 수 있다.
for (let key in person) {
  console.log(key + " : " + person[key]);
}

---

while문

while문은 조건식이 참인 경우에만 코드를 반복해서 실행한다.

while (조건) {
    // main logic
    // 증감식
}

let i = 0;

while (i < 10) {
    console.log(i)
    i++;
}

// 0 1 2 3 4

// 3초과 100미만의 숫자 중 5의 배수만 출력

let i = 3;

while (i < 100) {
    if (i % 5 === 0 && i >=5) {
        console.log(i + "는 5의 배수입니다")
    }   
    i++ 
}

&&(and)

 

do...while문

일단 한 번은 코드를 실행하고, 그 후에 조건식을 체크하여 반복 여부를 결정한다.

do {
  // main logic으로 while의 조건보다 먼저 시작됨(do)
} while (조건);

let i = 0;

do {
  console.log(i);
  i++;
} while (i < 10);

// 0 1 2 3 4 5 6 7 8 9

---

break문

break문은 반복문을 종료한다.

for (let i = 0; i < 10; i++) {
    console.log(i);
}

// 0 1 2 3 4 5 6 7 8 9

for (let i = 0; i < 10; i++) {
    if (i === 5) {
        break  // 이 조건을 만족하면 종료
    }
    console.log(i);
}
// 0 1 2 3 4

 

continue문

for (let i = 0; i < 10; i++) {
    if (i === 5) {
        continue  // 조건을 만족해도 계속됨
    }
    console.log(i);
}

// 0 1 2 3 4
// 6 7 8 9
// 5는 제외되면서 출력되는데
// 이는 if(i === 5)에 5가 해당되고 console로 넘어가지 않게 되고
// 그 다음 수인 6은 if에 해당되지 않으니 계속_continue되므로
// console 출력