JavaScript

제어문 (조건문, 반복문, 분기문)

히찔 2022. 5. 13. 17:15

 

제어문 (조건문, 반복문, 분기문)

 

제어문

  • 제어문은 프로그램의 흐름을 제어할 수 있도록 도와주는 실행문을 말한다.
  • 제어문은 조건문, 반복문, 분기문으로 나뉜다.

 

조건문

  • 조건문 혹은 선택문이라고 한다.
  • 조건식같은 분기로 나누어 결과에 따라 다른 코드를 실행할 수 있게 해주는 구문이다.
  • if문, if else문, switch문 등이 있다.

조건문이란?

  • 프로그램 내에서 주어진 표현식의 결과에 따라 별도의 명령을 수행하도록 제어하는 실행문이다.
  • 특정 조건 만족 시 실행하는 명령의 집합이다.

if...else 문

if (조건식) {
	// statment1
} else if (조건식) {
	// statment2
}
else {
	//statment3
}
  • if 안에 있는 조건식이 참인 경우 해당하는 if 문, else if 문을 실행한다.
  • 조건문 (if, else if)에 모두 해당하지 않으면 else에 있는 statement3 이 실행된다.
  • else if 에 갯수는 제한이 없다.
  • if 문은 중첩시켜 사용할 수 있다.
    • 💡  조건식 거짓으로 취급하는 값 
      1. false
      2. undefined
      3. null
      4. 0
      5. NaN
      6. the empty string (””)
    • 💡  조건문에서 사용할 수 있는 비교 연산자
      1. ===, !== : 한 값이 다른 값과 같은지, 다른지 판단
      2. <, > : 한 값이 다른 값보다 작은지, 큰지 판단
      3. <=, >= : 한 값이 다른 값보다 작거나 같은지, 크거나 같은지 판단

switch 문

switch (변수) {
	case A: //값 A
	// 변수 값이 A일때 실행할 명령문
		break
	case B: //값 B
	// 변수 값이 B일때 실행할 명령문
		break
	case C: //값 C
	// 변수 값이 C일때 실행할 명령문
		break
	default:
	// 모든 CASE에 부합하지 않을 때 실행할 명령문 =
		break
}

// EX)
const num = 3
switch(num % 2) { 
	case 0: 
		console.log("짝수")
		break
	case 1: 
		console.log("홀수")
		break
	default: 
		console.log("잘못된 입력 값")
		break
}
  • case 뒤에는 해당하는 조건이 오며, 그 아래에 실행할 명령문을 적는다.
  • default 는 if...else 조건문에서의 else 와 같이 모든 조건에 부합하지 않을 때 실행된다. (필수 X)
  • switch문은 break를 사용하지 않으면 적합한 조건문에서 분기하고도 그 아래 조건문 실행한다.

삼항연산자

let num = 3
(num % 2) ? console.log("짝수") : console.log("홀수") // 홀수 출력
  • 간단한 if 문이나 switch 문을 간결하게 바꾸어 사용할 수 있는 연산자이다.
  • <조건문> ? <참> : <거짓> 형태이다.

짧은 조건문

  • || 와 && 을 사용한 조건문이다.
  • true || alert('A') false || alert('B') // A는 실행되지 않고 B는 실행된다. true && alert('C') false && alert('D') // C는 실행되고 D는 실행되지 않는다.

💡 여기서 잠깐~!!!

대부분의 if…else 문은 삼항 조건 연산자로 바꿀 수 있다.

그렇다면! if…else 문과 삼항 조건 연산자의 차이는?

  1. 할당
    let kind = num > 0 ? '양수' : '양수 x' 는 표현식이다.
    즉 삼항 조건 연산자는 값으로 평가되는 표현식을 만든다.
    따라서 삼항 조건 연산자의 표현식은 값처럼 사용할 수 있기 때문에 변수에 할당할 수 있다.
    반면에 if…else 문은 표현식이 아닌 문이기 때문에 변수에 할당할 수 없고 조건식 안에서 할당처리를 해줘야 한다.
  2. scope

if…else 문은 중괄호로 감싸진 블록문으로 이루어져 있고, 삼항 연산자는 블록문을 만들 수 없다.

그렇기 때문에 자연스럽게 전역변수를 참조할 수 있는 있지만, 지역변수를 생성할 수는 없다는 한계를 가지고 있다.

 

반복문

  • 어떤 작업을 반복적으로 수행하고 싶을때 사용하는 구문이다.
  • 조건을 줘서 조건을 만족할 때까지 반복하게 할 수 있어 원하는 반복횟수만큼 반복을 할 수도, 무한대로 반복할 수도 있다.
  • for문, while문, do while문 등이 있다.

반복문이란?

  • 프로그램 내에서 똑같은 명령을 일정 횟수만큼 반복하여 수행하도록 제어하는 실행문이다.
  • 자바스크립트가 지원하는 반복문은 다음과 같다.
    1. for 문
    2. for / in 문
    3. for / of 문
    4. while 문
    5. do / while 문
    6. label 문
    7. break 문
    8. continue 문

for 문

  • for 반복문은 어떤 특정 조건을 불충족할때까지 반복한다.
for (초기문; 조건문; 증감문) {
    조건문의 결과가 참인 경우 반복적으로 실행하고자 하는 명령문
}

for / in 문

  • for / in 문은 해당 객체의 모든 열거할 수 있는 프로퍼티(enumerable properties)를 순회한다.
  • (배열의 인덱스를 반복한다.) 
    for (변수 in 객체) {
    객체의 모든 열거할 수 있는 프로퍼티의 개수만큼 반복적으로 실행하고자 하는 실행문
}

// EX) Array
let arrayin = ['기차', '버스', '비행기', '택시']

for (let i in arrayin){
 console.log(i)
}
>	0
	1
	2
	3

// EX) Object
let arrTest = {test:"Test", num:1}
for (arr in arrTest){ 
	console.log("프로퍼티 : " + arr + ", 값 : " + arrTest[arr])
}
>	프로퍼티 : test, 값 : Test
	프로퍼티 : num, 값 : 1

for / of 문

  • for / of 문은 반복할 수 있는 객체(iterable objects)를 순회한다.
  • 즉, 루프마다 객체의 열거할 수 있는 프로퍼티의 값을 지정된 변수에 대입한다.
  • 반복 가능 객체는 Array, Map, Set, arguments 객체 등이 있다.
  • 익스 플로러에선 지원하지 않는다.
  • (배열의 요소를 반복한다.)
for (변수 of 객체) {
    객체의 모든 열거할 수 있는 프로퍼티의 개수만큼 반복적으로 실행하고자 하는 실행문
}

// EX) Array
let arrayin = ['기차', '버스', '비행기', '택시'];

for (let i of arrayin){
 console.log(i)
}
>	기차
	버스
	비행기
	택시

// EX) Object => 반복 가능한 객체가 아니기 때문에 에러 발생!!! 
let arrTest = {test:"Test", num:1}
for (arr of arrTest){ 
	console.log(arr)
}
>	Uncaught TypeError

while 문

  • 특정 조건을 만족할 때까지 계속해서 주어진 실행문을 반복 실행한다.
  • while 문 내부에 표현식의 결과를 변경하는 실행문이 존재하지 않는 경우 무한루프에 빠질 수 있다.
while (표현식) {
    표현식의 결과가 참인 동안 반복적으로 실행하고자 하는 실행문
}

💡 for문과 while문

let i = 1
while (i < 10) {
	console.log(i)
	i++
}

===

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

 

do / while 문

  • 특정한 조건이 거짓으로 판별될 때까지 반복하며, 먼저 루프를 한 번 실행한 후에 조건문을 검사한다.
  • 즉, 루프 진입 전 조건문을 검사하는 while과는 달리 do / while 문은 최소 한 번은 루프를 실행한다.
do { 
    조건문의 결과가 참인 경우 반복적으로 실행하고자 하는 명령문
} while (조건문)

💡 while문과 do while문

let i = 1
do { // 변수 i가 1보다 작을 때만 while 문을 반복함
	console.log(i)
	i++
} while (i < 1)
> 1

let i = 1
while (i < 1) { // 조건이 맞지 않기 때문에 바로 종료
	console.log(i)
	i++
}
>

 

 

분기문

  • 선택문과 반복문에서 중간 흐름을 바꿀 수 있는 구문이다.
  • break문, continue문 등이 있다.

label 문

  • label 문은 프로그램 내의 특정 영역을 식별할 수 있도록 해주는 식별자이다.
  • label 문을 사용하면 continue 문과 break 문의 동작이 프로그램의 흐름을 특정 영역으로 이동시킬 수 있다.
label: 
    식별하고자 하는 특정 영역

break 문

  • 루프 내에서 사용하여 해당 반복문을 완전히 종료시키고, 반복문 바로 다음에 위치한 실행문으로 프로그램의 흐름을 이동시킨다.
  • 즉, 루프 내에서 표현식의 판단 결과에 상관없이 반복문을 완전히 빠져나가고 싶을 때 사용한다.
1. break; // 가장 안쪽의 반복문을 빠져 나온다.
2. break label이름; // 특정 label문에서 끝내고 나온다.

// EX) 라벨을 이용히여 구구단을 3단까지만 출력
gugudan:
for (let i = 2; i <= 9; i++) {
    dan:
    for (let j = 1; j <= 9; j++) {
        if (i > 3)
            break gugudan
        document.write(i + " * " + j + " = " + (i*j) + "<br>")
    }
}

continue 문

  • 루프 내에서 사용하여 해당 루프의 나머지 부분을 건너뛰고, 바로 조건문을 수행 한다.
  • 보통 반복문 내에서 특정 조건에 대한 처리를 제외하고자 할 때 자주 사용한다.
1. continue; // 현재 반복은 종료, 다음 반복 루프 실행
2. continue label이름; // 특정 label 루프 실행

// EX) 1부터 100까지 정수 중 3의 배수를 제외하고 출력
let exceptNum = 3
for (let i = 0; i <= 100; i++) {
    if (i % exceptNum == 0) // exceptNum의 배수는 출력하지 않음.
        continue
    document.write(i + " ")
}
반응형
저작자표시 비영리 동일조건 (새창열림)