코드스테이츠 프론트엔드 부트캠프 - Day 4

정우시·2022년 6월 28일
1

2. 코드스테이츠

목록 보기
5/52

[SEB FE] Section 1

Unit 3 - [JavaScript] 기초 제어문

  • 반복문

회고

오늘은 하루종일 반복문에 대해서 개념을 학습하고 문제를 풀었습니다. 제가 본 글 중에 '개발자를 꿈꾸는 취업 준비생에게'라는 박재성 선생님의 글이 있습니다.

여기서는 코딩을 처음 경험하는 비전공자의 경우 최소 한 개의 프로그래밍 언어를 활용해 변수, 배열, 조건문, 함수 정도는 자유롭게 사용할 수 있는 수준이 되어야 한다고 합니다.

그러기 때문에 코드스테이츠에서도 강조하여 HTML과 CSS보다 먼저 배우게 하는 거 같습니다. 저는 아주 좋았습니다. 그리고 의사코드...이거는 진짜 최고입니다. 완전 다른 세상이 열리네요.^_^

정규 시간 끝나서까지 남은 학생들에게 열강을 해주신 운도님 너무 감사드리며 내일도 화이팅~!

학습 목표

  • 반복문을 활용하여 단순한 기능을 반복하여 수행할 수 있다.
  • 반복문(for문)과 문자열, 숫자를 이용해 반복적으로 코드를 실행시킬 수 있다.
  • 기본적인 for문(for (let i = 0; i < 5; i++))을 응용하여 다양한 for문을 만들 수 있다.
  • for문과 while문의 차이에 관하여 설명할 수 있다.
  • 반복문과 조건문을 응용하여 특정 조건에서만 코드가 실행되도록 할 수 있다.
  • 이중 for문을 이해하고 활용할 수 있다.

개념 학습

- 반복문 (Loop Statement)

  • for(초기화; 조건식; 증감식) {}

실행순서

  • 1. 초기화
  • 2. 조건식의 값이 참이면 {} 코드블럭을 수행
  • 3. 증감식을 수행
  • 4. 조건식이 거짓이 될 때까지 2번과 3번을 반복함

for 구문 예시

  • 반복할 내용을 중괄호 block 안에 넣어준다.
  • 반복할 조건을 초기화, 조건식, 증감문 순으로 넣어준다.
let sum = 1;
for(let n = 2; n<= 4; n = n + 1) {
	sum = sum + n; // 반복할 내용
}
console.log(sum); // 10

무한 루프

for (;;) {

}

반복문 제어: continue, break;

  • continue를 만나면 아래에 있는 코드는 출력이 안되고 다음 반복으로 넘어간다.
for (let i = 0; i < 20; i++) {
	if (i === 10) {
    continue;
    }
    console.log(i);
}
  • break를 만나면 아래에 있는 코드를 중지한다.
for (let i = 0; i < 20; i++) {
	if (i === 10) {
    break;
    }
    console.log(i);
}

while 구문

  • 반복할 조건 중, 초기화, 증감문은 따로, 조건식만 괄호 안에 넣어줍니다.
let sum = 1;
let n = 2;

while(n <= 4) {
	sum = sum + n;
    n = n + 1;
}
console.log(sum); // 10

구구단 출력

  • 함수를 이용한 구구단 출력
let num = 3;

function multiplicationTables(num) {
	console.log(num * 1);
    console.log(num * 2);
    console.log(num * 3);
    console.log(num * 4);
    console.log(num * 5);
    console.log(num * 6);
    console.log(num * 7);
    console.log(num * 8);
    console.log(num * 9);
}

multiplicationTables(num)
  • 반복문을 이용한 구구단 출력
function multiplicationTables(num) {
	for(i = 1; i<= 9; i++) {
    console.log(num * i) // console.log가 아닌 return을 사용할 경우 함수가 종료되어 반복문 X
    }
}

multiplicationTables(2)
  • 이중 반복문을 이용한 구구단 출력
function multiplicationTables() {
	for(let n = 2; n <= 9; n++) {
    	for(let m = 1; m <= 9; m++) {
        	console.log(n * m)
        }
    }
}

multiplicationTables()
  • 이중 반복문을 이용한 후 템플릿 리터럴을 통해 구구단 출력
function multiplicationTables() {
	for(let n = 2; n <= 9; n++) {
    	for(let m = 1; m <= 9; m++) {
        	console.log(`${n} X ${m} = ${n * m}`)
        }
    }
}

multiplicationTables()
profile
프론트엔드 공부하고 있는 정우시입니다.

0개의 댓글