해체할당-및-객체매핑
typescript
해체할당..메시지를 객체매핑으로.. 수정. 반복도 수정.
if (registerForm && errorContainer) {
const userIdInput = registerForm.querySelector<HTMLInputElement>("#userId");
const passwordInput =
registerForm.querySelector<HTMLInputElement>("#password");
const nicknameInput =
registerForm.querySelector<HTMLInputElement>("#nickname");
const userId = userIdInput?.value;
const password = passwordInput?.value;
const nickname = nicknameInput?.value;
if (!userId) {
errorContainer.textContent = "아이디를 입력해주세요.";
return;
}
if (!password) {
errorContainer.textContent = "비밀번호를 입력해주세요.";
return;
}
if (!nickname) {
errorContainer.textContent = "닉네임을 입력해주세요.";
return;
}
if (password.length < 8) {
errorContainer.textContent = "비밀번호는 8자리 이상이어야 합니다.";
return;
}
errorContainer.textContent = "";
registerForm.submit();
}
if (registerForm && errorContainer) {
const { value: userId } = registerForm.querySelector("#userId") || {};
const { value: password } = registerForm.querySelector("#password") || {};
const { value: nickname } = registerForm.querySelector("#nickname") || {};
const errorMessages = {
userId: "아이디를 입력해주세요.",
password: "비밀번호를 입력해주세요.",
nickname: "닉네임을 입력해주세요.",
passwordShort: "비밀번호는 8자리 이상이어야 합니다.",
};
const validations = [
[!userId, "userId"],
[!password, "password"],
[!nickname, "nickname"],
[password && password.length < 8, "passwordShort"],
];
for (const [condition, key] of validations) {
if (condition) {
errorContainer.textContent = errorMessages[key];
return;
}
}
errorContainer.textContent = "";
registerForm.submit();
}