[내배캠/4일차] TIL - 미니플젝 개발 진행

euphony·2024년 12월 27일
0

내일배움캠프

목록 보기
20/66

✅오늘의 한 일

  • 미니 프로젝트 개발 진행
  • 자바 강의 듣기

💻오늘의 학습

미니 프로젝트

회원가입할 때 비밀번호 확인 받기

드디어 프로젝트 구현이 거의 끝났다. 추가적인 기능들을 보완하고 서로 피드백을 하는 시간을 가졌다. 오늘은 회원가입을 할 때 비밀번호를 확인하는 필드가 하나 더 있으면 좋을 것 같아 해당 기능을 추가했다.

다음과 같이 비밀번호와 비밀번호 확인 필드의 값을 비교하여 일치 여부를 확인하는 함수를 작성했다. 사용자가 입력 필드의 값을 변경하는 이벤트가 발생할 때마다 실행하는 콜백 함수이다.

function checkPasswordMatch() {
    const password = document.getElementById("sign-up-password").value;
    const passwordCheck = document.getElementById("sign-up-password-check").value;
    const message = document.getElementById("pw-confirm-message");

    if (!password || !passwordCheck) {
      message.textContent = ""; // 입력되지 않은 경우 초기화
      return;
    }

    if (password === passwordCheck) {
      message.textContent = "비밀번호가 일치합니다.";
      message.style.color = "green";
    } else {
      message.textContent = "비밀번호가 일치하지 않습니다. 다시 확인해주세요.";
      message.style.color = "red";
    }
  }

  document.getElementById("sign-up-password").addEventListener("input", checkPasswordMatch);
  document.getElementById("sign-up-password-check").addEventListener("input", checkPasswordMatch);

✔️ addEventListener 는 특정 HTML 요소에 이벤트를 연결(등록)할 때 사용하는 메서드이다.

기본 구문은 다음과 같다.

element.addEventListener(event, callback, options);
  • element : 이벤트를 등록할 HTML 요소
  • event : 발생할 이벤트 유형(예: click, input, change, submit 등)
  • callback : 이벤트가 발생했을 때 실행할 함수
  • options : 선택 사항
    • capture : 이벤트 캡처링 단계에서 이벤트 처리 여부 지정
    • once : 이벤트를 한 번만 실행한 후 제거할지 여부 지정
    • passive : 이벤트 핸들러가 기본 동작을 방해하지 않을 것임을 나타냄

그리고나서 회원가입 버튼 이벤트 핸들러 안에 비밀번호와 비밀번호 확인이 불일치 할 때 return 하도록 했다.

// Password가 불일치할 경우
if (password !== passwordCheck) {
  return;
}

자바 강의

체크 예외

❔체크 예외 : 개발자가 명시적으로 처리해야 하는 예외. Exception과 그 하위 예외(RuntimeException 제외)를 말한다. 체크 예외는 잡아서 처리하거나 던지는 것 둘 중에 하나를 반드시 선택해야 한다.

  • 장점 : 개발자가 예외를 누락하지 않도록 도와줘서 어떤 체크 예외가 발생하는지 쉽게 파악할 수 있다.
  • 단점 : 모든 체크 예외를 개발자가 처리해야하기 때문에 번거롭다.

Exception을 상속받으면 체크 예외, RuntimeException을 상속받으면 언체크 예외가 된다. try-catch-finally 구문을 통해 예외를 처리할 수 있다.

// Exception을 상속받은 예외는 체크 예외가 된다.
public class MyCheckedException extends Exception {
    public  MyCheckedException(String message) {
        super(message);
    }
}
public class Client {
    public void call() throws MyCheckedException {
        throw new MyCheckedException("ex");
    }
}

예외를 던질 때는 throws 키워드를 사용하는데, throw 와의 차이를 알아놓자.

  • throws : 발생시킨 예외를 메서드 밖으로 던질 때 사용하는 키워드
  • throw : 새로운 예외를 발생시킬 수 있는 키워드

다음과 같이 예외를 처리하는 callCatch() 메서드와 예외를 던지는 catchThrow() 메서드로 예외를 다룰 수 있다. catchThrow() 메서드에서 체크 예외는 예외를 잡지 않고 밖으로 던지려면 throws 예외를 메서드에 필수로 선언해야 한다는 것을 알 수 있다.

public class Service {
    Client client = new Client();
    
    public void callCatch() {

        try {
            client.call();
        } catch (MyCheckedException e) {
            System.out.println("예외 처리, message=" + e.getMessage());
        }
        System.out.println("정상 흐름");
    }
    
    public void catchThrow() throws MyCheckedException {
        client.call();
    }
}

언체크 예외

❔ 언체크 예외 : 런타임 예외라고도 하며, 개발자가 명시적으로 처리하지 않아도 되는 예외. RuntimeException 과 그 하위 예외를 말한다. 예외를 잡아서 처리하지 않아도 throws 키워드를 생략할 수 있다.

  • 장점 : 크게 신경쓰지 않아도 되는 예외를 무시할 수 있다.
  • 단점 : 컴파일러에서 예외 누락을 잡아주지 않아 개발자가 예외를 누락할 수 있다.

언체크 예외는 예외를 잡거나 던지지 않아도 된다. 예외를 잡지 않으면 자동으로 밖으로 던진다.

// RuntimeException을 상속받은 예외는 언체크 예외가 된다.
public class MyUncheckedException extends RuntimeException {

    public MyUncheckedException(String message) {
        super(message);
    }
}

체크 예외와 달리 throws 키워드를 사용하지 않은 것을 볼 수 있다.

public class Client {
    public void call() {
        throw new MyUncheckedException("ex");
    }
}

다음과 같이 필요한 경우 예외를 잡아서 처리할 수 있다. 물론 예외를 잡지 않아도 된다. 그런 경우 자연스럽게 상위로 넘어간다. 실행 결과는 체킁 예외와 동일하다.

public class Service {
    Client client = new Client();

    public void callCatch() {
        try {
            client.call();
        } catch (MyUncheckedException e) {
            System.out.println("예외 처리, message=" + e.getMessage());
        }
        System.out.println("정상 로직");
    }

    public void callThrow() {
        client.call();
    }
}

📝오늘의 회고

오늘은 프로젝트를 거의 끝내고 추가적인 기능을 구현 후, 팀원분들과 통합 테스트를 진행했다. 튜터님께서 저녁에 피드백을 해주신다고해서 그 전까지 기능을 모두 구현하고 디버깅하는 것에 집중했다. 튜터님께서 피드백을 하러 오셔서 간단히 시연했는데 아주 극찬을 해주셨다.😎 주말에 보완하지 않아도 될 것 같아서 다행이다. 다음주 발표까지 화이팅!

📌내일의 할 일

  • 자바 강의 듣기

0개의 댓글

관련 채용 정보