자바스크립트 반복문(while문, For문)

반복문

While문

• 조건이 참인 동안 코드블록을 반복
• 반복 횟수가 불 명확한 경우 주로 사용For문
• while(조건){ … 코드블록 … }
• 배열안의 요소를 하나씩 꺼내며 반복
• 배열의 길이만큼 처럼 반복 횟수가 명확한 경우 주로 사용
• for(var{변수}of{배열}){ //코드 블록 }
• 배열안의 요소를 하나씩 꺼내 {변수}에 저장하고 코드 블록을 실행

---

반복문의 활용

퀴즈 프로그램 알고리즘

• 덧셈 결과를 맞추는 프로그램 작성
• 임의의 두 수 생성
• 정답을 맞출 때까지 계속 시도

function max(arr) {
    var _max = -99999;   // 아주 작은 수
    for (var i of arr) {
        if (i > _max) {
            _max = i
        }
    }

    return _max;
}

console.log("가장 큰 수는 " + max([5, 7, 10, 3, 2]) + " 입니다.");

평균점수 계산 알고리즘

• 배열에 각 과목의 점수를 저장
• 총점 계산
• 총점 /과목수(배열의 원소 수) 를 이용해 평균 점수 계산

var scores = [90, 92, 84, 98, 70];
var sum = 0;

for (var score of scores) {
    sum += score;
}

console.log("총점: " + sum);
console.log("평균: " + (sum / scores.length));

가장 큰 수를 반환하는 함수

• 배열을 함수의 인자로 받음
• 배열의 요소 중 가장 큰 수를 반환

function max(arr) {
    var _max = -99999;   // 아주 작은 수
    for (var i of arr) {
        if (i > _max) {
            _max = i
        }
    }

    return _max;
}

console.log("가장 큰 수는 " + max([5, 7, 10, 3, 2]) + " 입니다.");

배열을 화면에 출력

• 리스트를 출력하기 위해 ul태그를 사용
• For반복문을 이용해 배열의 원소를 li 태그로 변환
• innerHtml 을 이용해 화면에 출력

<ul id="list"></ul>
<script>
    var list = document.getElementById('list');
    var products = [ '데스크탑', '모니터', '노트북', '스피커', '마우스' ];

    var html = '';
    for (var product of products) {
        html += '<li>' + product + '</li>';
    }

    list.innerHTML = html;
</script>