본문 바로가기

JavaScript

[JavaScript] 값이 null 일 경우 parameter 에 key 조차 존재하면 안 될 때


- 사용 기술 -
React(class형) / mobx



- 상황 -

자동차를 만들고 있다.
중간중간 점검을 실시한다.
점검은 총 5번 있다.

점검 일정이 잡히면 DB에 넣어둔다.
자동자A 의 점검 일정을 복사하여 
자동차B 점검 일정에 입력하는 기능이 있다.

carB.checkDate1 = carA.checkDate1 || "";
carB.checkDate2 = carA.checkDate2 || "";
carB.checkDate3 = carA.checkDate3 || "";
carB.checkDate4 = carA.checkDate4 || "";
carB.checkDate5 = carA.checkDate5 || "";



- 문제 -

점검은 날짜가 정해진 일정도 있고
아직 정해지지 않은 일정도 있다.
이때 날짜가 정해지지 않은 일정은
아래처럼 빈 문자열이 넘어간다.

carB = {
    checkDate1: "",
    checkDate2: "2022-12-17",
    checkDate3: "",
    checkDate4: "",
    checkDate5: "2022-12-24",
}


이걸 받아주는 백단에서 날짜 데이터 형식 에러가 났다.
Timestamp format must be yyyy-mm-dd hh:mm:ss[.fffffffff]
checkDate1: ""



- 해결 -

carA 에서 날짜가 있는 값은
carB 에서도 그대로 넣어서 보내주면 된다.
문제는 날짜가 없는 경우다.
날짜가 없는 값은 아예 파라미터에 해당 key 조차 존재하면 안 된다.

그러려면 null 체크를 하는 단계가 필수로 들어가야 한다.
값마다 똑같은 로직을 반복해서 작성하면 비효율적이다.
따라서 아래와 같이 수정했다.

먼저 null 체크가 필요한 key 들을 모아서 배열을 만들어 둔다.
그 배열을 forEach 문으로 한 바퀴 돌면서 안에 들어 있던 key 들을 하나씩 꺼내온다.
carA 에서 해당 key 로 value 가 있다면 carB 에도 해당 key 로 value 를 넣어준다.

const keyList = ["checkDate1", "checkDate2", "checkDate3", "checkDate4", "checkDate5"];
keylist.forEach((ele, idx, arr) => {
    if(carA[ele]) {
        carB[ele] = carA[ele];
    }
});



이전 코드는 key 가 무조건 생기고 null 체크 부분이 반복된다.
따라서 키가 새로 생기거나 로직이 변경되면 똑같은 수정을 여러 번 해주어야 하는 단점이 있었다.
새로 수정한 코드에서는 null check 를 수행해야 하는 key 값을 리스트에 추가만 하면 되고
null check 로직도 한 곳에서만 수정하면 되므로 훨씬 더 수정보완하기 편한 코드가 됐다.

-221216







반응형