시베리안 허숙희의 자바스크립트 비기닝 6 (반복문)

자바스크립트

by e7e 2023. 6. 3. 08:12

조건문의 핵심인 if문을 배웠으닝, 반복문도 한번 정리해 보장!

개발자라면 당근 조건문과 반복문이 뒤섞인 코드 속에서 평상심을 잃지 말공

console.log와 alert로 코드가 가려는 길을 디버깅으로 열어줘야 할 것이당.

컴터가 인간보다 잘 하는 건 확실히 빠른 반복일 것이당!(바보라서 부럽당!~~)

반복문에는 대표적으로 for문과 while문이 있당!

횟수가 정해져 있을 때는 for문, 모를 때는 while문을 권장한다는 말이 있지만

의미 없당. 어느 쪽이든 한쪽만 잘 쓰면 모두 커버 가능하당!

반복문.html을 아래 내용으로 맹글고,

역시 브라우져에서 결과와 소스를 호기심 만땅 아기고양이 눈빛으로 관찰하장!

<!DOCTYPE html>
<meta charset="UTF-8">
<script>
    var v_sum = 0;
    v_sum = v_sum + 1;
    v_sum = v_sum + 2;
    v_sum = v_sum + 3;
    v_sum = v_sum + 4;
    v_sum = v_sum + 5;
    v_sum = v_sum + 6;
    v_sum = v_sum + 7;
    v_sum = v_sum + 8;
    v_sum = v_sum + 9;
    v_sum = v_sum + 10;
    alert("1에서 10까지의 합은: " + v_sum + "일껄");
</script>

여러분이 개발자로서 위와 같은 코드를 짰고, 개발자 아닌 친구가 여러분의 코드를 보았다면,

친구는 잠자기 전 "뭐양, 저 정도면 거짐 카복의 반복인데, 내가 더 잘하지 않을까?" 생각 할 것이당!

잘 했당!, 대한민국에 새로 개발자의 길을 걷고자 하는 젊은이의 추가당!

위 소스는 for문을 이용하여 아래 처럼 작성 할 수 있당!

<!DOCTYPE html>
<meta charset="UTF-8">
<script>
var v_sum = 0;
for(var i=1; i<=10; i++){
    v_sum = v_sum +i;
}
alert("1에서 10까지의 합은: " + v_sum + "얌");
</script>

for문의 규칙은 아래와 같당!

for(초기치;조건;증감연산){
    //조건이 만족되었을 때 실행되는 블록
}

맨처음 초기치가 딱 한번만 실행되고, 조건으로 넘어가서 조건이 만족되면 {} 블록 안의 코드가 실행되고

증감연산식이 실행되고, 다시 조건 평가되고 만족 하면 블록 안의 코드가 반복되는 식의

조건 <-> 증감연산이 반복되다가, 조건이 만족하지 않으면 블록 밖으로 제어가 튀어 나오게 된당!

while문은 for문으로도 아래처럼 구현이 가능하당 (그래서 while문은 skip하겠당!)

<!DOCTYPE html>
<meta charset="UTF-8">
<script>

var v_sum = 0;
var i=1;
//for(;"요따구로 써도 된당";){
for(;;){
    // 무한루핑 사용할 땐 항상 종료 조건을 먼저 생각하랑
    if(i > 10) break;

    v_sum = v_sum +i;
    i= i+1;
}
alert("1에서 10까지의 합은: " + v_sum + "얌");
</script>

for(;;) 는 초기치없음; 조건없음(그래서 무한루핑);증감연산식 없음을 의미해서 while(true)와 같당

for(;"요따구";)도 "요따구"가 boolean으로 자동변환되면 true가 되기 땜시 역시 while(true)와 같당

무한루핑(Endless Loop)이라면 항상 종료조건을 먼저 생각하고, 코딩을 하는 것이 좋당

(당근 당근 당연한 이야기당)

반복문(for든 while이든)을 빠져 나가는 것은 break를 사용한당!

(아직 설명 안했지만 함수(function)안에 있을 때는 return으로 함수를 종료시키며 나가도 된당!!)

반복문에서 break 보다 빈도가 덜 하긴 하지만 가끔 필요한 것이 있는 데 continue당

반복문 안에서 continue를 만나면 다시 증감식 ->조건 체크로 올라간당.

곧 continue 아래 문장들을 하지 않는다는 것이당!

아래 코드는 6만 빼고 1~10까지의 합을 구하기 위해 continue를 사용하였당!

<!DOCTYPE html>
<meta charset="UTF-8">
<script>
var v_sum = 0;
var i=1;
for(;;){
    // 무한루핑 사용할 땐 항상 종료 조건을 먼저 생각하랑
    if(i > 10) break;

    if(i==6) {   // 6만 널뛰깅!
        i = i+1; // 이게 없다면 6에서 무한루핑 됨!(왜 증감연산식이 없엉!)
        continue; // 증감연산식 -> 조건체크로 다시 진행
    }

    v_sum = v_sum +i;
    i= i+1;
}
alert("1에서 10까지의 합은: " + v_sum + "얌");
</script>

자바스크립트에는 특별한 for문이 2개 더 있는뎅, 어려운 말 버리공 쉽게 가면

for 변수 of 배열 과 for 변수 in 객체가 있당! (전자야 안 쓰면 그만이지만, 후자는 필요할 때가 있당);

아래 코드를 실행해 보공,

<!DOCTYPE html>
<meta charset="UTF-8">
<script>
    /*** for 변수 of 배열 ***/ 
    var blackPink = ["로제","제니","리사","지수"];
    for(var v_value of blackPink){
        alert("v_value: " + v_value);
    }


    /*** for 변수 in 객체 ***/ 
    var myRoze = {
        name:"로제",
        age:26,
        song:"gone",
        home:'호주'
    }

    for(var v_key in myRoze){
        alert("v_key: " + v_key);
        alert("v_key => 값: " + v_key + " => " + myRoze[v_key]);
    }

</script>

myRoze[v_key] 부분이 JSON 배열식 접근법, 연관배열등으로 불리는 문법인데 낯설당!

괜찮당 당신은 very 긍정적이당. 추후에 별도로 심도 있게 다루공,

오늘은 대괄호([ ])안에 꼬옥 숫자만 들어가는 건 아니구낭 하는 잔상(요거이 재산이당!)만 남기장!

한 분야의 전문가가 된다는 거?, 유전적으로 해당 분야의 천재성을 부여 받지 않았다 하더라도,

시간차를 배제하면 건강한 체력을 기반으로 한 업무적 반복을 통해 다린(달인)은 누구나 될 수 있겠당,

반복되는 업무 위에 인간적 사랑까지 얹는다면 그 때 당신은 다링(darling)으로 따뜻하게 반짝인당!

Star is born 영화는 레이디 가가에 대한 오랜 나의 편견(레이디 가가는 절대 내 스타일 아니얌!!)을

깨고, 날 그녀의 팬으로 만들었당!, 황당하다 팬이 되니 그녀의 모든 노래가 그냥 더 없이 좋당!

선풍기 팬은 그저 스위치를 누르면 제자리를 맴돌 뿐이당!

https://www.youtube.com/watch?v=52nfjRzIaj8

'자바스크립트' 카테고리의 다른 글

시베리안 허숙희의 자바스크립트 비기닝 8 (연산자) (0)	2023.06.05
시베리안 허숙희의 자바스크립트 비기닝 7 (함수 function) (0)	2023.06.03
시베리안 허숙희의 자바스크립트 비기닝 5 (조건 & 자동 형변환) (0)	2023.06.02
시베리안 허숙희의 자바스크립트 비기닝 4 (변수동작: 복사와 참조) (0)	2023.06.01
시베리안 허숙희의 자바스크립트 비기닝 3 (0)	2023.05.30