투케이2K

99. (javascript/자바스크립트) new Array 배열에서 splice 사용해 특정 데이터 전체 삭제 수행 본문

JavaScript

99. (javascript/자바스크립트) new Array 배열에서 splice 사용해 특정 데이터 전체 삭제 수행

투케이2K 2021. 7. 27. 09:35

[개발 환경 설정]

개발 툴 : Edit++

개발 언어 : javascript


[소스 코드]

    <!-- 내부 JS 지정 -->
    <script>

    	/*
    	[JS 요약 설명]
    	1. window.onload : 브라우저 로드 완료 상태를 나타냅니다 
    	2. includes : 특정 데이터 포함 여부를 확인합니다 
    	3. splice : 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경합니다
    	*/

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


    		// [초기 배열 및 삭제할 데이터 선언 실시 및 이벤트 함수 호출]
    		var arrayList = ["하나", "둘", "셋", "하나"];
    		var removeData = "하나";
    		arrayList = arrayRemoveData(arrayList, removeData);
    		console.log(""); 
    		console.log("[arrayList] : [result] : " + JSON.stringify(arrayList)); // JSON.stringify 출력해야 대괄호 [] 포함한 배열 형식 출력됨
    		console.log("");


    		// [jsonArray 선언 및 삭제할 데이터 선언 및 이벤트 함수 호출]
    		var jsonArray = [];
    		var removeJsonData = "\"idx\":" + "1"; //특정 삭제할 key, value 값을 문자열 형태로 선언 [쌍따옴표 포함 key 지정 필요]
    		for (var i=1; i<=3; i++){
    			var jsonObject = {"idx" : i, "name":String(i)+" name"};
    			jsonArray.push(jsonObject); // 배열에 데이터 삽입 실시
    		}    		
    		jsonArray = arrayRemoveData(jsonArray, removeJsonData); //jsonArray object 형식 그대로 전송
    		console.log("");
    		console.log("[jsonArray] : [result] : " + JSON.stringify(jsonArray)); // JSON.stringify 출력해야 대괄호 [] 포함한 배열 형식 출력됨
    		console.log("");


    	};



    	/* [이벤트 함수 정의] */
    	function arrayRemoveData(array, data){
    		console.log("");
    		console.log("[arrayRemoveData] : [start]");
    		console.log("[original stringify] : " + JSON.stringify(array)); 
    		console.log("[original array] : " + array); 
    		console.log("[original length] : " + array.length);
    		console.log("[remove data] : " + data);    		
    		console.log("");
    		// for 반복문을 돌면서 배열 데이터를 확인합니다
    		var removeCount = 0;
    		for(var k=0; k<array.length; k++){
    			var checkData = JSON.stringify(array[k]);
    			checkData = checkData.replace(/ /gim, "");
    			if(checkData.includes(data)){ // 특정 배열 번지 값이 인풋으로 들어온 data 일 경우
    				array.splice(k, 1);
    				k--;
    				removeCount ++;
    			}
    		}
    		console.log("");    		
    		console.log("[arrayRemoveData] : [remove success]");   
    		console.log("[remove count] : " + removeCount);   
    		console.log("[remove array] : " + JSON.stringify(array));	   		
    		console.log("");

    		// [리턴 데이터 반환 실시]
    		return array;
    	};
    	
    </script>

[결과 출력]


[요약 설명]

/*

[JS 요약 설명]

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

2. includes : 특정 데이터 포함 여부를 확인합니다

3. splice : 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경합니다

*/


 

반응형
Comments