투케이2K

122. (javascript/자바스크립트) array filter 배열 필터 메소드 사용해 특정 데이터 목록 제외 후 출력 실시 본문

JavaScript

122. (javascript/자바스크립트) array filter 배열 필터 메소드 사용해 특정 데이터 목록 제외 후 출력 실시

투케이2K 2021. 9. 23. 08:23
반응형

[개발 환경 설정]

개발 툴 : Edit++

개발 언어 : javascript


[소스 코드]

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

        /*
        [JS 요약 설명]
        1. window.onload : 브라우저 로드 완료 상태를 나타냅니다
        2. filter : 특정 데이터를 걸러 낸 후 새로운 배열을 만듭니다
        3. JSON.stringify : 배열 데이터 목록을 string 형식으로 출력합니다 
        */


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

            // 초기 배열 데이터 선언 실시
            var arrayNumber = [1, 2, 3, 1, 1];
            var arrayString = ["하나", "둘", "셋", "하나", "하나"];


            // 초기 저장된 배열 데이터 출력 실시
            console.log("");
            console.log("[window onload] : [원본]");
            console.log("[arrayNumber] : " + JSON.stringify(arrayNumber));
            console.log("[arrayString] : " + JSON.stringify(arrayString));
            console.log("");


            // 배열 데이터 필터 메소드 호출 실시
            var numberFilterArray = arrayNumber.filter(arrayNumberDataFilter); // number 필터
            var stringFilterArray = arrayString.filter(arrayStringDataFilter); // string 필터
            console.log("");
            console.log("[window onload] : [필터]");
            console.log("[numberFilterArray] : " + JSON.stringify(numberFilterArray));
            console.log("[stringFilterArray] : " + JSON.stringify(stringFilterArray));
            console.log("");

        };



        /* [number 배열 데이터 필터 메소드] */ 
        function arrayNumberDataFilter(value, index, array) {
            // filter 메소드를 사용해서 1 값이 아닌 것만 반환 실시
            return value != 1;
        }; 


        /* [string 배열 데이터 필터 메소드] */ 
        function arrayStringDataFilter(value, index, array) {
            // filter 메소드를 사용해서 1 값이 아닌 것만 반환 실시
            return value != "하나";
        };        
                
    </script>

[결과 출력]


[요약 설명]

/*

[JS 요약 설명]

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

2. filter : 특정 데이터를 걸러 낸 후 새로운 배열을 만듭니다

3. JSON.stringify : 배열 데이터 목록을 string 형식으로 출력합니다

*/


 

반응형
Comments