[혼공JS] 2주차 미션

2024.01.12 - [프로그래밍 공부/Javascript] - [혼공JS] 조건문 chapter3

2024.01.12 - [프로그래밍 공부/Javascript] - [혼공JS] 반복문 chapter 4

2024.01.15 - [프로그래밍 공부/Javascript] - [혼공JS] 함수 chapter 5

 

다 해놓고 업로드를 안한 멍청이 그게 바로 접니다!

이왕 늦은거 5 챕터까지 하고 제출하는걸로

 

2주차 미션

 

p. 139 의 확인 문제 3번 문제 풀고 완전한 코드 만들어 비쥬얼 스튜디오 코드에서 실행 결과 인증하기

 

기본미션

 

정답 : && 

이유 : 10초과 20미만의 수를 동시에 만족할때를 말하므로 AND조건인 &&이다.

 

선택미션 

p. 152의 <태어난 연도를 입력받아 띠 출력하기> 예제 실행하여 본인의 띠 출력한 화면 캡처하기

const rawInput = prompt(`태어난해를 입력해주세요`,'')
        const year = Number(rawInput)
        const e = year %12 // 12간지 계산 나머지로 순서를 정하는것
        let result
        switch(e)
        {
            case 0 : result=("원숭이")
            break
            case 1 : result=("닭")
            break
            case 2 : result=("개")
            break
            case 3 : result=("돼지")
            break
            case 4 : result=("쥐")
            break
            case 5 : result=("소")
            break
            case 6 : result=("호랑이")
            break
            case 7 : result=("토끼")
            break
            case 8 : result=("용")
            break
            case 9 : result=("뱀")
            break
            case 10 : result=("말")
            break
            case 11 : result=("양")
            break
        }
        alert(`${year}에 태어나셨다면 ${result}띠 입니다.`)

switch 코드 

---

회고 - 콜백은 도대체 뭔가....

조건문 반복문 함수 초입까지는 문제 없었습니다. 그래 그래도 할만하지 하고 넘어가는데

콜백에서부터 머리에서 김이 나옵니다....

문제 풀이하면서 생각나는건 .... 그냥 함수 3번 반복해서 쓰면 되는거 아닌가??? 왜 도대체 왜....

콜백으로 사용해가면서 3번 반복하는거지?

침착하게 구글링하면서 다른 선배님들의 글을 봤다...

결론부터 두가지 이유가 있는데.... 이유가 다르다? 이건 또 뭐지..?

첫번째 이유는 추상화라는 개념때문이라고 한다.

만일 우리가 함수로만 사용을 한다면 후일 다른 동작으로 변경해야할때 일일이 바꿔줘야 한다면,

콜백의 경우 콜백함수만 수정해주면 되기때문이라고 한다.

 

2번째 이유는 비동기 프로그래밍으로 한 코드의 연산이 끝날때 까지 멈추는게 아니라 그 다음 코드의 동작을 하기 위해 사용한다고 한다. 

 

뭔가 의견 둘다 동떨어진 의견이라 다음에 객체까지 배우고 나서

날잡고 콜백에 대해 다시 글을 올려야 겠습니다...

 

---

진짜 프로젝트 준비 

이젠 진짜 슬슬 프로젝트를 생각하면서 공부해도 좋지않을까 생각이 들었습니다.

그래서 Chatgpt에게 물어보았습니다. 입문용 프로젝트 주제 좀 추천해줘!

13가지나 추천해주네요... 이렇게 많이는 필요없는뎅 ;;;

1. 랜덤 명언 생성기:공개 API에서 랜덤 명언을 가져와 웹 페이지에 표시합니다. 이 프로젝트는 API 요청 및 DOM 업데이트에 익숙해지는 데 도움이 됩니다.
   
   
2. 할 일 목록 앱:사용자가 작업을 추가, 편집 및 제거할 수 있는 간단한 할 일 목록을 만듭니다. 이 프로젝트는 기본적인 DOM 조작을 포함합니다.
   
   
3. 계산기:사칙 연산을 수행하는 기본 계산기를 만듭니다. 이 프로젝트는 사용자 입력 및 기본적인 계산 처리를 연습하는 데 도움이 됩니다.
   
   
4. BMI 계산기:사용자가 체중과 키를 입력하고 앱이 BMI를 계산합니다. 이는 기본적인 양식 처리 및 수학적 계산을 포함합니다.
   
   
5. 날씨 앱:사용자 입력(위치)을 기반으로 API에서 날씨 데이터를 가져와 현재 날씨를 표시합니다. 이 프로젝트는 API 작업 및 사용자 입력 처리를 소개합니다.
   
   
6. 기억력 게임:사용자가 짝을 이룬 카드를 찾는 간단한 기억력 게임을 만듭니다. 이 프로젝트는 게임 상태 및 사용자 상호 작용 관리를 포함합니다.
   
   
7. 화폐 변환기:API에서 환율을 가져와 다른 통화 간에 금액을 변환할 수 있는 화폐 변환기를 만듭니다. 이 프로젝트는 API 요청 및 보다 복잡한 사용자 상호 작용을 포함합니다.
   
   
8. 간단한 그림 그리기 앱:사용자가 서로 다른 색상과 브러시 크기를 사용하여 캔버스에 그림을 그릴 수 있는 기본적인 그림 그리기 앱을 개발합니다. 이 프로젝트는 캔버스 조작 및 이벤트 처리를 소개합니다.
   
   
9. 카운트다운 타이머:특정 시간을 설정하고 카운트다운하는 카운트다운 타이머를 설계합니다. 이 프로젝트는 시간 및 사용자 입력 처리를 포함합니다.
   
   
10. 인터랙티브 퀴즈 게임:객관식 문제가 있는 퀴즈 게임을 만듭니다. 사용자가 문제에 답하면 앱이 성적에 대한 피드백을 제공합니다. 이 프로젝트는 문제 관리, 사용자 입력 및 점수 처리를 포함합니다.
    
    
11. 사진 갤러리:사용자가 이미지를 업로드하고 갤러리에서 그림을 그릴 수 있는 앱을 만듭니다. 이 프로젝트는 파일 업로드 및 보다 복잡한 UI 작업을 포함합니다.
    
    
12. 채팅 애플리케이션:사용자가 채팅 룸에 참여하고 실시간으로 메시지를 보낼 수 있는 간단한 채팅 애플리케이션을 개발합니다. 이 프로젝트는 실시간 통신을 위해 웹 소켓을 사용하는 것을 포함합니다.
    
    
13. 레시피 북:사용자가 레시피를 추가, 편집 및 삭제할 수 있는 레시피 북 애플리케이션을 만듭니다. 레시피 분류와 같은 기능을 포함합니다. 이 프로젝트는 데이터 관리 및 보다 복잡한 사용자 상호 작용을 포함합니다.