TIL 20 | JS(제어문)
6247 단어 모던자바스크립트DeepDive모던자바스크립트DeepDive
모던자바스크립트 Deep Dive에서 발췌한 제어문에 대한 내용을 적어보자
공부 후에도 이해가 잘 가지 않는 부분 발생!!
1)경우의 수가 세 가지일 때 삼항연산자로 표현하는 방법
2)다중for문이 동작하는 순서, console.log([${i}, ${j}]
)의 의미
3)continue문의 동작 순서
한 바퀴 돌고나면 이해될 수도 있으니 그 때 다시 보기로 결정
제어문
- 제어문은 조건에 따라 코드 블록을 실행(조건문)하거나 반복 실행(반복문)할 때 사용
- 제어문을 사용하면 코드의 실행 흐름을 인위적으로 제어할 수 있음
- 제어문의 종류
- 블록문
- 조건문 : if..else, switch
- 반복문 : for문, while문
- break문
- continue문
블록문(=코드불록, 블록)
- 블록문은 0개 이상의 문을 중괄호로 묶은 것으로, 코드 블록 또는 블록이라고 부름
- 자바스크립트는 블록문을 하나의 실행 단위로 취급 : 블록문 끝에 세미콜론을 붙이지 않음(블록문은 문의 종료를 의미하는 자체종결성을 가짐)
- 블록문은 단독으로 사용할 수도 있으나 일반적으로 제어문이나 함수를 정의할 때 사용
- 블록문 활용 예제
1. 블록문
{
var foo = 10;
}
2. 제어문
var x = 1;
if(x < 10) {
x++;
}
3. 함수 선언문
function sum(a, b) {
return a + b;
}
조건문
- 조건문은 주어진 조건식의 평가결과(참/거짓)에 따라 코드블록(블록문)의 실행을 결정
- 조건식은 Boolean 값으로 평가될 수 있는 표현식
- JS 엔진은 if...else문과 switch문 두 가지 조건문을 제공
if... else 문
- if... else문은 주어진 조건식(불리언 값으로 평가될 수 있는 표현식)의 평가결과에 따라 실행할 코드블록을 결정
- 조건식의 평가 결과가 true인 경우 if문의 코드 블록이 실행되고 false일 경우 else문의 코드블록이 실행
- 만일 if문의 조건식이 Boolean 값이 아닌 값으로 평가되면 JS 엔진에 의해 암묵적으로 Boolean 값으로 강제변환되어서 실행할 코드블록을 결정
1. 조건식이 1개인 경우
if(조건식) {
// 조건식이 참이면 이 코드 블록이 실행된다
} else {
// 조건식이 거짓이면 이 코드 블록이 실행된다
}
2. 조건식이 2개인 경우
if(조건식1) {
// 조건식1이 참이면 이 코드 블록이 실행된다
} else if(조건식2){
// 조건식2가 참이면 이 코드 블록이 실행된다
} else {
// 조건식1과 조건식 2가 모두 거짓이면 이 코드 블록이 실행된다.
}
- else if 문과 else 문은 옵션이어서 사용할 수도 있고 사용하지 않을 수도 있음
var num = 0;
var kind;
if(num > 0) {
kind = '양수';
} else if(num < 0) {
kind='음수' ;
} else {
kind='0';
}
console.log(kind);
콘솔 출력 값 : 0
- 대부분의 if...else문은 삼항 조건 연산자로 바꿔 쓸 수 있음
- 삼항조건연산자는 값으로 평가되는 표현식을 만들기 때문에 변수에 할당이 가능하지만, if문은 값으로 평가되지 않는 문이기 때문에 변수에 할당이 되지 않는다
var x = 2;
var result;
// 2 % 2는 0이다. 이때 0은 false로 암묵적 강제 변환된다
if (x % 2) {
result = '홀수';
} else {
result = '짝수';
}
console.log(result); // 짝수
- 위의 예제 삼항 조건 연산자로 바꿔보기
var x = 2;
var result = x % 2 ? '홀수' : '짝수';
console.log(result); // 출력 : 짝수
- 경우의 수가 세 가지('양수', '음수', '영')이라면
var num = 2;
var kind = num ? (num > 0 ? '양수' : '음수') : '영';
console.log(kind); // 출력 : 양수
- 코드블록 내의 문이 하나 뿐인 경우 중괄호 { }는 생략이 가능하다
if(x > 0) console.log(result = '정수');
switch 문
- switch 문은 주어진 표현식을 평가하여 그 값과 일치하는 표현식을 갖는 case 문으로 실행흐름을 옮김
- case 문은 상황을 의미하는 표현식을 지정하고 콜론으로 마침
- switch 문의 표현식과 일치하는 case 문이 없다면 실행순서는 default 문으로 이동한다 > default문은 선택사항이다
switch(표현식) {
case 표현식1:
switch문의 표현식과 표현식1이 일치하면 실행될 문;
break;
case 표현식2:
switch문의 표현식과 표현식2기 일치하면 실행될 문;
break;
default:
switch문의 표현식과 일치하는 case문이 없을 때 실행될 문;
}
- 폴스루 : break문이 없으면 switch의 표현식과 일치하는 case의 표현식을 만나더라도 switch문을 탈출하지 않고, 이후의 모든 case문과 default문을 실행
- case의 표현식이 같을 경우, 여러 개의 case를 묶어서 사용할 수도 있음
var year = 2000;
var month = 2;
var days = 0;
switch (month){
case 1 : case 3 : case 5 : case 7 : case 8 : case 10 : case 12 :
days = 31;
break;
.... 이런 식으로...
반복문
- 조건식의 평가결과가 참인 경우 코드블록을 실행. 그 후, 조건식을 다시 평가하여 여전히 참인 경우 코드블록을 다시 실행 > 조건식이 거짓일 때까지 반복
- 반복문을 대체할 수 있는 다양한 기능 : JS는 배열을 순회할 때 사용하는 forEach 메서드, 객체의 property를 열거할 때 사용하는 for...in문 등 반복문을 대체할 수 있는 다양한 기능을 제공함
for 문
- for문은 조건식이 거짓으로 평가될 때까지 코드블록을 반복실행하는 문
- 형태 :
for(변수 선언문 또는 할당문 ; 조건식 ; 증감식){
조건식이 참인 경우 실행될 문;
}
- 예제
for( var i = 0; i < 2; i++) {
console.log(i);
}
출력 : 0
1
- 무한루프 형태 : 변수 선언문, 조건식, 증감식 모두 option > 아무 것도 선언하지 않으면 무한루프가 된다
- 중첩for문 : for문 내에 for문을 중첩해서 사용한 경우
- 예제 : 두 개의 주사위를 던졌을 때, 두 눈의 합이 6이 되는 모든 경우의 수를 출력
for(var i=1; i >=6; i++){
for(var j=1; j >=6; j++){
if(i+j===6) console.log(`[${i}, ${j}]`);
}
출력
[1, 5]
[2, 4]
[3, 3]
[4, 2]
[5, 1]
while 문
- 주어진 조건식의 결과가 참이면 코드블록을 반복실행 > for문은 반복의 횟수가 명확할 때 주로 사용하며 while문은 반복의 횟수가 불명확할 때 사용
- while문은 조건식의 평가결과가 거짓이 되면 코드블록을 실행하지 않고 종료
var count = 0;
while (count < 3) {
console.log(count);
count++;
}
- 무한루프 : 조건식의 결과가 언제나 참이면 무한루프가 됨
- while문의 코드블록 안에 if문으로 탈출조건을 만들고 break문으로 코드블록을 탈출하도록 할 수도 있음
var count = 0;
while(count < 3) {
console.log(count);
count++;
if(count === 3) break;
}
do... while 문
- do...while문은 코드블록이 먼저 실행되고 조건식을 평가하기 때문에 코드블록이 무조건 한 번 이상은 실행된다
- 예제
var count = 0;
do {
console.log(count);
count++;
} while(count < 3);
break 문
- break문은 코드블록을 탈출한다(레이블문, 반복문, switch문의 코드블록을 탈출
- 이외에 break문 사용하면 SyntaxError(문법에러) 발생시킴
if(true) {
break;
}
continue 문
- coutinue문은 반복문의 코드블록 실행을 현 지점에서 중단 > 반복문의 증감식으로 실행문을 이동시킴
- 예제
var string = 'Hello World.';
var search = 'l';
var count = 0;
for (var i = 0; i < string.length; i++);
if (string[i] !== search) continue;
count++;
}
console.log(count) // 3
Author And Source
이 문제에 관하여(TIL 20 | JS(제어문)), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://velog.io/@yeonbee/TIL-20-JS제어문
저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
- 블록문
- 조건문 : if..else, switch
- 반복문 : for문, while문
- break문
- continue문
1. 블록문
{
var foo = 10;
}
2. 제어문
var x = 1;
if(x < 10) {
x++;
}
3. 함수 선언문
function sum(a, b) {
return a + b;
}
1. 조건식이 1개인 경우
if(조건식) {
// 조건식이 참이면 이 코드 블록이 실행된다
} else {
// 조건식이 거짓이면 이 코드 블록이 실행된다
}
2. 조건식이 2개인 경우
if(조건식1) {
// 조건식1이 참이면 이 코드 블록이 실행된다
} else if(조건식2){
// 조건식2가 참이면 이 코드 블록이 실행된다
} else {
// 조건식1과 조건식 2가 모두 거짓이면 이 코드 블록이 실행된다.
}
var num = 0;
var kind;
if(num > 0) {
kind = '양수';
} else if(num < 0) {
kind='음수' ;
} else {
kind='0';
}
console.log(kind);
콘솔 출력 값 : 0
var x = 2;
var result;
// 2 % 2는 0이다. 이때 0은 false로 암묵적 강제 변환된다
if (x % 2) {
result = '홀수';
} else {
result = '짝수';
}
console.log(result); // 짝수
var x = 2;
var result = x % 2 ? '홀수' : '짝수';
console.log(result); // 출력 : 짝수
var num = 2;
var kind = num ? (num > 0 ? '양수' : '음수') : '영';
console.log(kind); // 출력 : 양수
if(x > 0) console.log(result = '정수');
switch(표현식) {
case 표현식1:
switch문의 표현식과 표현식1이 일치하면 실행될 문;
break;
case 표현식2:
switch문의 표현식과 표현식2기 일치하면 실행될 문;
break;
default:
switch문의 표현식과 일치하는 case문이 없을 때 실행될 문;
}
var year = 2000;
var month = 2;
var days = 0;
switch (month){
case 1 : case 3 : case 5 : case 7 : case 8 : case 10 : case 12 :
days = 31;
break;
.... 이런 식으로...
- 반복문을 대체할 수 있는 다양한 기능 : JS는 배열을 순회할 때 사용하는 forEach 메서드, 객체의 property를 열거할 때 사용하는 for...in문 등 반복문을 대체할 수 있는 다양한 기능을 제공함
for(변수 선언문 또는 할당문 ; 조건식 ; 증감식){
조건식이 참인 경우 실행될 문;
}
for( var i = 0; i < 2; i++) {
console.log(i);
}
출력 : 0
1
for(var i=1; i >=6; i++){
for(var j=1; j >=6; j++){
if(i+j===6) console.log(`[${i}, ${j}]`);
}
출력
[1, 5]
[2, 4]
[3, 3]
[4, 2]
[5, 1]
var count = 0;
while (count < 3) {
console.log(count);
count++;
}
var count = 0;
while(count < 3) {
console.log(count);
count++;
if(count === 3) break;
}
var count = 0;
do {
console.log(count);
count++;
} while(count < 3);
if(true) {
break;
}
var string = 'Hello World.';
var search = 'l';
var count = 0;
for (var i = 0; i < string.length; i++);
if (string[i] !== search) continue;
count++;
}
console.log(count) // 3
Author And Source
이 문제에 관하여(TIL 20 | JS(제어문)), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@yeonbee/TIL-20-JS제어문저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)