투케이2K

109. (javascript/자바스크립트) 반복문을 수행해 배열 array 데이터 출력 실시 - for , in , forEach , map 본문

JavaScript

109. (javascript/자바스크립트) 반복문을 수행해 배열 array 데이터 출력 실시 - for , in , forEach , map

투케이2K 2021. 8. 6. 18:12

[개발 환경 설정]

개발 툴 : Edit++

개발 언어 : javascript


[소스코드]

    <!-- 내부 JS 지정 : 일반 -->
    <script>

        /*
        [JS 요약 설명]
        1. window.onload : 브라우저 로드 완료 상태를 나타냅니다
        2. 배열 : 자바스크립트에서 배열은 대괄호 [] 및 new Array 를 사용해서 선언할 수 있습니다 
        3. new Array 사용해서 배열 선언 시 push 를 사용해 데이터를 삽입합니다        
        */


        /* [html 최초 로드 및 이벤트 상시 대기 실시] */
        window.onload = function() {
            console.log("");
            console.log("[window ready] : [start]");
            console.log("");

            // 이벤트 함수 호출 
            checkArrayData();
        };


        /* [이벤트 수행 부분] */                       
        function checkArrayData() {
            console.log("");
            console.log("[checkArrayData] : [start]");
            console.log(""); 

            // 초기 변수 선언 및 데이터 삽입 실시
            var arr = new Array();
            arr.push("하나");
            arr.push("둘");
            arr.push("셋");            
            console.log("[checkArrayData] : [원본] : " + JSON.stringify(arr));
            console.log("");

            // 일반 for 문 사용해서 배열에 들어있는 데이터 확인 실시
            for (var i=0; i<arr.length; i++){
                console.log("[for] : [index] / [value] : " + i + " / " + arr[i]); 
            }
            console.log(""); 

            // 일반 for in 문 사용해서 배열에 들어있는 데이터 확인 실시
            for (var index in arr){
                console.log("[for in] : [index] / [value] : " + index + " / " + arr[index]); 
            }
            console.log("");

            // forEach 사용해서 배열에 들어있는 데이터 확인 실시 
            arr.forEach((value, index) => {
                console.log("[forEach] : [index] / [value] : " + index + " / " + value); 
            });
            console.log(""); 
            
            // map 사용해서 배열에 들어있는 데이터 확인 실시             
            arr.map((value, index) => {
                console.log("[map] : [index] / [value] : " + index + " / " + value);                
            });
            
        }; 
                
    </script>

[결과 출력]


[요약 설명]

/*

[JS 요약 설명]

1. window.onload : 브라우저 로드 완료 상태를 나타냅니다

2. 배열 : 자바스크립트에서 배열은 대괄호 [] 및 new Array 를 사용해서 선언할 수 있습니다

3. new Array 사용해서 배열 선언 시 push 를 사용해 데이터를 삽입합니다

*/


 

반응형
Comments