투케이2K

32. (javascript/자바스크립트) Promise 사용해 비동기 작업 처리 수행 실시 - 타입별 로직 분류 처리 본문

JavaScript

32. (javascript/자바스크립트) Promise 사용해 비동기 작업 처리 수행 실시 - 타입별 로직 분류 처리

투케이2K 2021. 6. 7. 09:53

/* =========================== */

[ 개발 환경 설정 ]

개발 툴 : Edit++

개발 언어 : javascript

/* =========================== */

/* =========================== */

[소스 코드]

 

    <script>
    	/* 
    	[JS 요약 설명]
    	1. Promise : 자바스크립트 비동기 처리에 사용되는 객체입니다
    	2. 비동기 처리 : 특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 수행합니다
    	3. Promise는 주로 서버에서 받아온 데이터를 화면에 표시할 때 사용하며, 그외에 비동기 처리 작업을 수행할 때 사용합니다    	
    	*/    	    	    	
    	
    	
    	/* 이벤트 함수 정의 */
    	function main() {
    		
    		/* 비동기 작업 호출 실시 */
    		callPromise(0);
    		
    		/* 비동기 작업 호출 실시 */
    		callPromise(1);
    		
    	};
    	
    	
    	/* promise : 비동기 작업 처리 실행 함수 */
    	function callPromise(type){
    		/* 비동기 작업 실시 */
    		const promise = new Promise(function(resolve, reject) {
    			/* 타입 구분에 따른 로직 분류 처리 */
    			if(type == 0){
    				try{
    					// 수행 시작
    					console.log("type [0] : [Start]");
    					
    					/* 로직 처리 */
    					var date_velue = getNowTime24();
    					
    					/* 결과 반환 */
    					resolve(date_velue); // 수행 성공 					
    				}
    				catch(exception){
    					reject("Exception"); // 수행 실패    					
    				}    				
    			}    			
    			if(type == 1) {
    				try{
    					// 수행 시작
    					console.log("type [1] : [Start]");
    					
    					/* 로직 처리 : 에러를 강제 발생 시키기 위해 문법  작성*/    					
    					throw new Error("error");
    					
    					/* 결과 반환 */
    					resolve(date_velue); // 수행 성공 					
    				}
    				catch(exception){
    					reject("Exception"); // 수행 실패    					
    				}
    			}				
			});
    		/* 응답 결과 확인 */
    		promise.then(function(value) {
    			if(type == 0){
    				console.log("type [0] : [Success] : " + value); // 성공 처리
    			}
    			if(type == 1){
    				console.log("type [1] : [Success] : " + value); // 성공 처리
    			}
    		}, 
    		function(reason) {
    			if(type == 0){
    				console.error("type [0] : [Error] : " + reason); // 오류 처리    				
    			}
    			if(type == 1){
    				console.error("type [1] : [Error] : " + reason); // 오류 처리    				
    			}
    		});
    	}
    	
    	
    	/* 현재 날짜 및 시간을 구하는 함수 */
    	function getNowTime24(){
    		// DATE 객체
    		var NOW_DATE = new Date(); 

    		// UTC 시간 계산
    		const UTC = NOW_DATE.getTime() + (NOW_DATE.getTimezoneOffset() * 60 * 1000); 

    		// UTC to KST (UTC + 9시간)
    		const KR_TIME_DIFF = 9 * 60 * 60 * 1000;
    		const KR_DATE = new Date(UTC + (KR_TIME_DIFF));    		

    		// 개별 데이터 확인 실시
    		var YYYY = KR_DATE.getFullYear(); // 연 (4자리)    		
    		var MM = ("00"+(KR_DATE.getMonth()+1)).slice(-2); // 월 (2자리)
    		var DD = ("00"+KR_DATE.getDate()).slice(-2); // 일 (2자리)

    		var HH24 = ("00"+KR_DATE.getHours()).slice(-2); // 시간 (24시간 기준, 2자리)
    		var MI = ("00"+KR_DATE.getMinutes()).slice(-2); // 분 (2자리)
    		var SS = ("00"+KR_DATE.getSeconds()).slice(-2); // 초 (2자리)    		

    		// 리턴값 데이터 포맷 실시
    		var return_format = YYYY + "-" + MM + "-" + DD + " " + HH24 + ":" + MI + ":" + SS;    		
    		
    		return return_format;
    	}
    	
    </script>

/* =========================== */

/* =========================== */

[결과 출력]

/* =========================== */

/* =========================== */

[요약 설명]

/*

[JS 요약 설명]

1. Promise : 자바스크립트 비동기 처리에 사용되는 객체입니다

2. 비동기 처리 : 특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 수행합니다

3. Promise는 주로 서버에서 받아온 데이터를 화면에 표시할 때 사용하며, 그외에 비동기 처리 작업을 수행할 때 사용합니다

*/

/* =========================== */

 

반응형
Comments