Chapter 05. 조건문과 반복문

1. 개요

조건문이란 특정 조건이나 값에 따라 실행문을 실행하는 명령어를 말한다.

컴퓨터의 기본 원리가 0과 1로 전류를 흐르게 하는 동작이만큼, 컴퓨터의 구동에서 조건이라는 것은 매우 중요한 위치를 가진다.

 

또한 조건과 마찬가지로 컴퓨터가 특정 작업을 반복하는 것은 현대 인류 사회의 노동 구조를 바꾸었다. 

프로그램에서 조건문과 반복문의 중요성은 말로 다 표현할 수 없으며, 현재 사용하는 프로그램의 대부분은 조건문과 반복문을 기반으로 제작이 가능하다. 

 

2. 조건문: if(조건){실행문1; 실행문2; …;}

조건이 참이라면 {} 안의 실행문을 실행한다.

if만으로도 조건에 따른 실행문 구현이 가능하지만 일반적으로 if(조건){실행문1} else{실행문2}으로 사용한다.

조건이 맞다면 실행문 1이 실행되고, 조건 외의 경우에는 실행문 2로 수렴한다.

만약, 다수의 조건을 한 조건문에서 적용하고 싶다면 if else를 사용하면 된다.  

 

if(조건){실행문1} else if(조건){실행문2}.....else if(조건){실행문n} else{실행문 default}

var usernum = prompt("숫자를 입력하세요");
console.log(usernum);
console.log(typeof(usernum));
if(usernum!==null&&usernum===Number){//입력창 null 체크
  if(usernum%3===0){
 	 alert("3의 배수임");
  } else if(usernum%2===0){
  	alert("2의 배수임");
  } else if(usernum%5===0){
  	alert("5의 배수임");
  } else {
  	alert("3배수 아님");
  } else{
 	 alert("입력취소")
  }

           

위와 같이 if 실행문에 if를 이중 사용하는게 가능하며, 연산자를 통한 조건식에 따른 ‘참’과 ‘거짓’ 여부로 작동한다.

조건이 참이 아니라면 다음 else로 수렴하고, ‘참’에 따라 실행문이 진행된 뒤에 if문 안에서 추가로 연산을 진행하지 않는다. 

 

3. 분기문: switch (변수){ case value: 실행문;}

변수의 값에 따라 case의 실행 여부를 결정한다.

변수의 value에 따라 ‘시작점’이 지정되는 것이기 때문에 별도의 break;가 없다면 해당 value 아래에 모든 명령어가 실행된다.

때문에 조건문의 기능이 필요하다면 반드시 break;가 필요하다. 

 

var num = 2;
switch (num) {
  case 1: console.log(“1”);
  case 2: console.log(“2”);
  case 3: console.log(“3”);
}

//출력값 : console 로그에서 2와 3

var num = 2;

switch (num) {
  case 1: console.log(“1”);
  break;

  case 2: console.log(“2”);
  break;

  case 3: console.log(“3”);
  break;
}

//출력값 : console 로그에서 2

 

value의 값으로 출력 정보가 정해지기 때문에 해당하지 않는 값이 정해지는 경우도 있다.

그럴 경우, default를 지정하여 일치하는 value가 없는 경우의 실행문을 지정할 수 있다.

재밌는 점은 분기를 기준으로 default 또한 실행문의 일부이기 때문에 break가 없다면 같이 실행된다.

 

var num = 3;

switch (num) {
  case 1: console.log(“1”);
  break;

  case 2: console.log(“2”);
  break;

  case 3: console.log(“3”);

  default: console.log(‘No value”)
}

//출력값 : console 로그에서 3과 No value

 

분기점 지정의 기능을 하지만 break와 사용하면 조건문과 같은 효과를 낼 수 있고, value 값에 따른 특정 동작 실행에 효과적인 문법이다.

 

4. 반복문: for (초기 값; 종료 조건; 증감 연산) {실행문}

for 반복문은 초기값을 확인한 뒤에 종료 조건의 충족여부를 확인하고, 종료 조건이  참이라면 증감 수식을 수행한다.

그 뒤 ‘실행문’을 수행하고 ‘종료 조건’의 충족 여부를 확인하여 증감과 실행문을 반복한다. 

 

4.1. for 의 연산 순서

---

for( i=1 ①; i<6 ②⑤; i++ ④⑦){

console.log(i); ③⑥}

---

처리 순서는 ①~⑦ 이며, 종료 조건이 되기까지 ②~⑦....를 반복한다.

⑦수행하고 ②로 돌입하였을 때, 종료조건에 충족되면 즉시 종료된다.

 

4.2. 반복문 for과 조건문 if의 사용 

int e = 0;

for (e = 1; e <= 20; ++e) {
  console.log("@");
  if (e==10) {
 	 alert(stop);
  }
}

 

반복문에서 if를 통한 조건 부여 또한 가능한데, 일정 수치까지 반복한 뒤에 if의 실행문이 한번 수행되고, 다시 반복문 수행으로 진행된다. 

 

4.3. 반복문 for의 무한 루프 

for ( ; ; ) {
	console.log(“dog”);
}

 

위와 같이 조건을 지정하지 않으면 무한루프가 생성되어 실행문을 계속 진행한다.

종료 조건의 달성 여부는 참과 거짓 여부로 결정되며, 데이터가 없는 경우 true 인식하며, 항상 ‘참’이므로 중단하지 않으면 명령문이 반복되는 것이다.

 

4.4. 증감 연산의 지정

for (e = 1; e <= 20; e+=2)

 

증감 연상은 ++, --를 사용하는데 이는 단항 연산자로 [변수 = 변수 +1]과 동일하다.

때문에 대입연산자를 이용하여 증감 조건을 지정할 수 있다. [변수 = 변수 + 2] 나 [ 변수 +=2] 와 같이 지정이 가능하기 때문에 특정 조건을 세부적으로 지정할 수 있다.

같은 원리로 e+=0 이라면 e는 항상 같은 값이므로 무한 루프에 해당한다. 

 

4.5. 반복문 for의 이중 사용 

반복문 안에 또다른 반복문을 포함하면 해당 변수 값에 따라 반복문을 여러차례 수행한다.

중요한 것은 for을 이용하는 실행문에 다른 조건문이나 반복문 등을 사용할 수 있다는 점이다. 

 

4.6. for in 과 for of

자바스크립트는 객체라는 데이터 타입이 존재하며, 이를 이용하여 반복문을 사용할 수 있다.

객체는 배열, Map, Set, arguments가 있다.

for문으로 작성이 가능하여 자주 사용하지는 않지만 for 문을 더욱 간략하게 작성할 수 있다는 장점이 있다. 

---

for (변수 in 객체) {
  객체의 모든 열거할 수 있는 프로퍼티의 개수만큼 반복적으로 실행하고자 하는 실행문;
}

---

var arr = [3, 4, 5];
for (var i = 0; i < arr.length; i++) { // 배열 arr의 모든 요소의 인덱스(index)를 출력함.
    document.write(i + " ");
}
for (var i in arr) { // 위와 같은 동작을 하는 for / in 문
    document.write(i + " ");
}

---

for (변수 of 객체) {

    객체의 모든 열거할 수 있는 프로퍼티의 개수만큼 반복적으로 실행하고자 하는 실행문;

}

---

var arr = [3, 4, 5];
for (var i = 0; i < arr.length; i++) { // 배열 arr의 모든 요소의 인덱스(index)를 출력함.
    document.write(arr[i] + " ");
}
for (var value of arr) { // 위와 같은 동작을 하는 for / of 문
    document.write(value + " ");
}​

 

5. while문 

While문은 우선 조건이 참인지를 판단하고 참이면 내부의 실행문을 수행한다.

수행 후 다시 조건으로 루프하여 참 여부를 판단후, 참이면 수행하고 거짓이면 실행문을 종료한다. 

프로그래머가 특정할 수 없는 영역을 반복하거나 표시할 때 사용한다. 

---

while (조건) {

    표현식의 결과가 참인 동안 반복적으로 실행하고자 하는 실행문;

}

---

 

 

6. do while문

 while문은 루프에 진입하기 전에 조건을 먼저 판단한다. 하지만 do ~ while 문은 먼저 루프를 실행하고 조건을 판단한다. 한마디로, do ~ while문은 조건에 상관없이 실행문을 한번은 수행하고 이후에 조건을 판단한다는 것이다. 

---

do {

    표현식의 결과가 참인 동안 반복적으로 실행하고자 하는 실행문;

} while (표현식);

---

7. 조건문에 오류가 발생하는 경우 

자바스크립트에서 조건문의 참과 거짓 여부는 데이터의 연산을 통한 ‘비교’ 외에 ‘데이터 자체가 있는지 혹은 없는지’와 ‘데이터의 default 값이 true 혹은 false 여부’로 결정된다. 

 

조건문은 기본적으로 true면 명령을 실행하는데, 명령문의 참과 거짓 여부는 데이터의 값에 따라 결정된다.

문제는 자바스크립트가 가지고 있는 데이터에서 일부 데이터는 반드시 ‘거짓’으로 인식하는 경우이다. 

 

자바스크립트에서 값이 0이거나 null 인 경우, 해당 값 자체를 조건으로 잡는다면 이는 반드시 거짓으로 인식된다. (연산자 없이) 이런 경우 조건문 자체가 실행이 불가능해진다. 

 

아래의 경우의 수를 보면서 내용을 이해하거나, 오류 발생시 탐색하자.

 

var number=3;
var str="롤링롤링롤링"
if(str){
	console.log("조건이 참이다 맨이야 str");
}
/*
Js는 조건에 변수나 명제 자체가 들어가도 'true'로 인식한다. js에서는 1byte가 모두 0000 0000 이면 false로 인식한다. 외에는 모두 ture이다.  
즉, 선언된 변수가 존재한다면 이 변수를 표현하기 위해 '2진수'로 데이터를 저장할 것이고, 이 데이터가 어떤 형태이던 01로 표현하여 반드시 1을 포함한다.
이러한 이유로 문장열이나 문자, 0이외에 다른 숫자도 반드시 '참'이다. 
*/
            
// 조건이 참 , 실행 가능 > ture
if(3<5){
	console.log("조건이 참이다 맨이야 3<5");
}

// 조건 거짓 , 실행 불가 > false
if(3==5){
	console.log("조건이 참이다 맨이야 3==5");
}

// 값이 0 , 실행 불가 > false
if(0){
	console.log("조건이 참이다 맨이야 0");
}

// 값이 00000000 , 실행 불가 > false, 0이 몇 개이던 0
if(0000000000){
	console.log("조건이 참이다 맨이야 0");
}

// 값이 0이 아닌 경우, 실행 가능 > ture
if(22){
	console.log("조건이 참이다 맨이야 22");
}

// 값이 0이 아닌 경우, 실행 불가, 선언되지 않은 변수, notdefined
if(A){
	console.log("조건이 참이다 맨이야 A");
}

// 값이 지정되지 않은 경우, 실행 불가, 선언되었으나 타입이 지정되지 않음 
var a;
console.log(typeof(a));

if(a){
	console.log("조건이 참이다 맨이야 a");
}

// 값이 문자열이나 데이터가 없는 경우, 실행 불가, 선언되었으나 데이터가 없음
var b = "";
console.log(typeof(b));

if(b){
	console.log("조건이 참이다 맨이야 b=null");
}

var bb = " ";
console.log(typeof(bb));

if(bb){
	console.log("조건이 참이다 맨이야 bb");
}

// 값이 배열, 실행 가능 > ture

var c = [1, 3, 4, 55, 22]
console.log(typeof(c));

if(c){
	console.log("조건이 참이다 맨이야 c = 배열")
}