-
제어문 (조건문, 반복문, 분기문)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 문은 중첩시켜 사용할 수 있다.
- 💡 조건식 거짓으로 취급하는 값
- false
- undefined
- null
- 0
- NaN
- the empty string (””)
- 💡 조건문에서 사용할 수 있는 비교 연산자
- ===, !== : 한 값이 다른 값과 같은지, 다른지 판단
- <, > : 한 값이 다른 값보다 작은지, 큰지 판단
- <=, >= : 한 값이 다른 값보다 작거나 같은지, 크거나 같은지 판단
- 💡 조건식 거짓으로 취급하는 값
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 문과 삼항 조건 연산자의 차이는?
- 할당
let kind = num > 0 ? '양수' : '양수 x' 는 표현식이다.
즉 삼항 조건 연산자는 값으로 평가되는 표현식을 만든다.
따라서 삼항 조건 연산자의 표현식은 값처럼 사용할 수 있기 때문에 변수에 할당할 수 있다.
반면에 if…else 문은 표현식이 아닌 문이기 때문에 변수에 할당할 수 없고 조건식 안에서 할당처리를 해줘야 한다. - scope
if…else 문은 중괄호로 감싸진 블록문으로 이루어져 있고, 삼항 연산자는 블록문을 만들 수 없다.
그렇기 때문에 자연스럽게 전역변수를 참조할 수 있는 있지만, 지역변수를 생성할 수는 없다는 한계를 가지고 있다.
반복문
- 어떤 작업을 반복적으로 수행하고 싶을때 사용하는 구문이다.
- 조건을 줘서 조건을 만족할 때까지 반복하게 할 수 있어 원하는 반복횟수만큼 반복을 할 수도, 무한대로 반복할 수도 있다.
- for문, while문, do while문 등이 있다.
반복문이란?
- 프로그램 내에서 똑같은 명령을 일정 횟수만큼 반복하여 수행하도록 제어하는 실행문이다.
- 자바스크립트가 지원하는 반복문은 다음과 같다.
- for 문
- for / in 문
- for / of 문
- while 문
- do / while 문
- label 문
- break 문
- 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 + " ") }
반응형'JavaScript' 카테고리의 다른 글
스택(Stack) 구현하기 (0) 2022.05.19 String Method (0) 2022.05.13 논리 연산자 (0) 2022.02.21 Template literals (0) 2022.02.21 데이터 타입 (0) 2022.02.14