자바에서 쓰는  확장 for문 같은 느낌!!

설명보단 바로 실전 투입이 이해가 잘 됨!

 

예제1.

어차피 나오는 결과는 같음 for~in문 쓰는게 더 간결하다!

var arr5=['가','나','다'];

console.log('[일반 for문 형식]');
for(var k=0; k<arr5.length;k++)
    console.log(arr5[k]);
        
 console.log('[for in 문 형식]');
 for(var index in arr5)
    console.log('인덱스:%s,요소값:%s',index,arr5[index]);

 

예제 2

컬렉션일 때!!

Value에 해당하는 값을 꺼내올 때는 obj.key 로는 쓸 수 없음 !! 대신 obj[key]라고 써야 함!

var obj = {name:'가길동',age:20,addr:'가산동'};
console.log('[for in]문');
for(var key in obj)     
    console.log('key:%s,value:%s',key,obj[key]);  //키 값도 같이 출력하고 싶어서 이렇게 출력 함

 

 

예제3. 최종보스(HTML5 과 자바스크립트 콜라보)

몇 가지 먼저 개념 정리

 

document.querySelector('#a')  : 함수의미는 a를 가진 요소를 다 찾는다는 뜻이래!

숫자를 출력할 때는

new Number(textNode.value) 이렇게 써도 되고

parseInt(textNode.value) 이렇게 써도 됨! 오 자스에도 parseInt가 있당!

숫자가 나와서 정리하는건데

숫자 인지 아닌지 확인할 땐

NaN으로 비교하는거 아니고 inNaN()함수로 확인해야 한다!

사용자에게 입력값 받을 때 쓰는 함수는 prompt() (자바에서 Scanner 역할 인 듯)

<fieldset>
        <legend>학생의 평균 구하기</legend>  <!--서버로 전송 안함 현재 페이지에서만 처리할 거-->
        학생 수 입력 : <input type="text" id="students" />
        <button onclick='getAverage()'>평균 구하기</button>
      </fieldset>  <!--- 여기까지는 html 영역--->
      <script>
        //배열선언
        var score=[];
        var textNode = document.querySelector('#students');
       // console.log(textNode,parseInt(textNode.value)); 함수가 정의 되어있지 않아서 입력값 받아도 노 쓸모임
          function getAverage(){     // 그러니 그냥 껍데기 뿐인 함수모양에 진짜 함수를 정의시키기
            console.log('사용자 입력값',parseInt(textNode.value));
        //  console.log('사용자 입력값',new Number(textNode.value)); 이거도 가능!
         
                //우선 사용자가 입력한게 숫자지 판단 해야함
            var numberOfStudents=parseInt(textNode.value);
     //     console.log(numberOfStudents == NaN) ; 이렇게 비교 노노노노
            console.log(isNaN(numberOfStudents));     //이거로 숫자 인지 아닌지 판단
            if(isNaN(numberOfStudents)){
                alert('숫자만 입력하세요!!'); // 숫자가 아닐 때 팝업창 띄워서 알려주고
                return;   // 다시 입력 받기
            }         
               //학생 수 만큼 점수 입력 총합 평균구하기
            var total=0;
 //         console.log(prompt('점수를 입력하세요')); 학생 수 만큼 점수를 받아야 하기 때문에 이렇게 받으면 안될 걸?
            for(var i=0; i<numberOfStudents ; i++){
                  score.push( parseInt(prompt(i+1+'번째 점수를 입력하세요')));
                  total += score[i];
             }
            console.log('[학생의 성적 출력]');
            for(var index in score){
                  console.log('%s번째 학생:%s',parseInt(index)+1,score[index]);
             }
             console.log('총점:%s,평균:%s',total,total/score.length);
        }
      </script>

'학원 > JS' 카테고리의 다른 글

10/31 32-7 [JS] Array 메소드 이어서....  (1) 2022.10.31
10/28 31-4 [JS] Array 주요 메소드 정리  (1) 2022.10.29
10/27 30-6 [JS] Array  (1) 2022.10.27
10/27 30-6 [JS] Operator  (0) 2022.10.27
10/26 29-7 [JS] Variable01  (0) 2022.10.26

+ Recent posts