WEB/JavaScript
[JavaScript] 배열 내 객체의 특정 키 값 유효성 검사하기
kimohzl
2024. 6. 10. 16:49
DataTable의 한 행에서 값들을 입력하여 추가하거나 수정하여 저장하는 기능을 개발했다.
저장을 하기 전에 필수로 입력해야하는 값이 있다면 입력 여부를 확인해야한다.
필수로 검사 할 객체의 키를 배열로 받아, 해당 키들이 모두 값이 있는지 확인할 수 있는 공통 함수를 작성했다.
처음에 작성했던 로직
export const isValidNull = (keys, list) => {
if (!keys) return false;
return list.some((item) => {
let isNull = false;
keys.some((key) => {
if (item[key] !== null && typeof item[key] === "object") {
isNull = !item[key].value;
} else {
isNull = !item[key];
}
});
return isNull;
});
};
📌 기능 오류
필수 키가 여러 개 있을 때, 마지막 값만 필수인지 검사했다.
📌 문제점
- keys.some의 반환값 사용
- 내부 keys.some 루프에서 isNull 값을 설정하지만, some 메서드는 true를 반환하는 순간 순회를 중단한다.
따라서 isNull의 최종 값이 항상 keys.some의 마지막 검사 결과에 의존하게 된다.
- 내부 keys.some 루프에서 isNull 값을 설정하지만, some 메서드는 true를 반환하는 순간 순회를 중단한다.
- isNull 변수의 재설정
- isNull 변수가 내부 루프 (keys.some) 안에서 항상 다시 설정되기 때문에,
외부 루프 (list.some)에서는 isNull의 상태를 제대로 확인하지 못한다.
- isNull 변수가 내부 루프 (keys.some) 안에서 항상 다시 설정되기 때문에,
수정된 로직
export const isValidNull = (keys, list) => {
if (!keys) return false;
return list.some((item) => {
return keys.some((key) => {
if (item[key] !== null && typeof item[key] === "object") {
return !item[key].value;``
} else {
return !item[key];
}
});
});
};
- return 사용
- keys.some에서 적절히 return하여 true 또는 false를 반환함으로써 불필요한 변수 상태 관리를 피함
- 내부 return 사용
- keys.some의 각 반복에서 직접 값을 반환하여 isNull 변수를 제거
📌 결과
내부 로직이 isNull 변수를 유지할 필요 없이 올바른 결과를 반환하며,
some 함수를 사용하여 조건에 맞는 경우 즉시 true를 반환하고 루프를 종료한다.
즉, 값이 없다면 바로 true를 반환한다.
로직을 수정하며 잘못된 변수 상태 관리와 코드의 불필요한 복잡함을 개선했다.
사용 예시
const saveHandler = async () => {
try {
const validationKeys = ["taskCd", "skipCd"];
const isNull = isValidNull(validationKeys, selected.value);
if (isNull) {
throw {
msg: commonCode("MESSAGE", "MSGI000123"),
type: "warning",
}; // 필수 값을 입력해주세요.
}
// ... 저장 로직
}
}