김민태의 데브캠프 2기 - 실시간 강의(11/26)

강의 내용 요약

• if / switch 문의 단점
  • 수행하고자 하는 작업이 변경되면 함수 자체를 수정해야 함
  • 식과 문 (동적)
    • 문 자체가 버그가 날 수 있는 구조를 가지고 있음
    • 따라서 문을 선호하지 않음
    ⇒ 문 대신, 객체를 이용하는 방법이 있음

    type Actions: {
    	[key: string]: () => void
    }
    
    function SomethingTask(action: string) {
    	const actions: Actions = {
    		ADD: () => {
    			console.log("ADD");
    		}
    		DELETE: () => {
    			console.log("DELETE");
    		}
    		UPDATE: () => {
    			console.log("UPDATE");
    		}
    		FETCH: () => {
    			console.log("FETCH");
    		}
    		PUT: () => {
    			console.log("FETCH");
    		}
    		DEFAULT: () => {
    			console.log(`Invalid action: ${action}`)
    		}
    	}
    	
    	const executeAction = actions[action](); // 함수이기 떄문에 소괄호 써서 함수 형태로 호출
    	//에러처리 코드
    	//수정 전 -> if도 "문"이므로 수정이 필요
    	if(executeAction) {
    		executeAction();
    	} else {
    		console.log(`Invalid action: ${action}`);
    	}
    	//수정 후
    	(actions[action] || actions['DEFAULT'])();
    	//OR 기법은 굉장이 자주 쓰이니 꼭 익숙해지시길..!
    }
    
    //but, 여전히 somethingTask의 액션을 변경할려면 함수 내부 자체를 변경해야함 -> 좋지 않은 구조
    //수정 버전 -> 변수 분리
    function SomethingTask(action: string) {
    		(actions[action] || actions['DEFAULT'])();
    }
    
    	const actions: Actions = {
    		ADD: () => {
    			console.log("ADD");
    		}
    		DELETE: () => {
    			console.log("DELETE");
    		}
    		UPDATE: () => {
    			console.log("UPDATE");
    		}
    		FETCH: () => {
    			console.log("FETCH");
    		}
    		PUT: () => {
    			console.log("FETCH");
    		}
    		DEFAULT: () => {
    			console.log(`Invalid action: ${action}`)
    		}
    	}
    

  • ex)
• action의 각각의 작업을 변경할 수 없음
  • 테스트가 불가능
  • 테스트 코드를 활용하여 자동화 가능
  • 테스트가 용이한 testable 구조를 만들어야 함
  • ⇒ 테스트가 용이한 구조는 곧 잘 분리되어 있는 코드를 의미