wa_ter_ve
GDG-WEB 2주차 과제 본문
* 디스코드 공지 확인 안 하신 분들 확인하세요~
코드 쓰는 방법에는 여러가지가 있지만
도무지 감이 안 잡힌다 하시는 분들은 힌트 보고 그 과정대로 차근차근 작성해보세요!
📌 과제1
[html,css 파일]
본인이 원하는 상품을 판매하는 창을 만들어보도록 합시다!
이미지 소스에 판매할 상품의 이미지를 넣고, 내용은 자유로이 작성해 주시면 됩니다.
다만, 전체적인 양식은 그대로 구현해야 합니다.(css) 더 꾸미고 싶으시면 그래도 좋습니다^^
구현한 모든 것이 화면에 바로 보이도록 스크롤이 생기지 않게 구현합니다.
각 주문자 이름, 수량, 주소, 전화번호 칸에 글자 입력이 가능해야 합니다.
수량 버튼을 누르면 목록이 떠 선택이 가능해야 합니다.
(수량 목록 개수는 3개 이상이기만 하면 몇 개를 해도 상관없습니다~)
주문하기 버튼을 누르면 브라우저 상단에 alert창이 떠야합니다.
📌 과제2
[js 파일]
함수를 통해 평균 구하기
let students = {
남도일: 92,
유미란: 84,
하인성: 88,
유가영: 76
};
function Average(studentScore) {
// 이 부분에 들어갈 내용을 채워서 제출.
return Math.floor(total / Object.values(studentScore).length); //소수점 버리는 코드
}
let averageScore = Average(students);
console.log(`네 사람의 평균 성적: ${averageScore}`);
학생들과 각 성적을 객체로 정의하였습니다.
평균 성적 계산 함수를 통해 빈 부분을 채워서
네 사람의 평균 성적: 85
가 출력되도록 하시면 됩니다.
- 콜백 함수에 대해 아직 배우지 않았기에 코드 알려드립니다.
*참고로 콜백 함수는 다른 함수에 전달되어 호출되는 함수입니다.
(sum, score) => sum + score
- 객체에서 value값만을 뽑아서 저장하는 함수
Object.values ()
[힌트]
빈칸에 들어갈 코드의 과정
1. 객체들의 value값들만을 뽑아 배열을 생성.
2. 평균값을 구하기 위해 누적값을 저장하는 메소드와 함께 콜백 함수 코드 사용.
📌 과제3
[js 파일]
for문을 사용하여 0부터 10이하의 정수 중에서 홀수 만을 내림차순으로 나열하고
이를 문자열로 변환하여 출력하세요.
[힌트]
1. 문자열 배열 변수 선언 및 할당
2. 반복문 사용 (내림차순 반복)
3. 조건문 사용 (홀수만)
4. 문자열 배열에 조건에 해당하는 숫자들을 할당
(+ 조건문을 한 번 더 사용해서 문자간 띄어쓰기 할 수 있으면 하기)
5. 콘솔 출력
📌 과제4
[js 파일]
세 개의 주사위를 던졌을 때, 눈의 합이 10이 되는 모든 경우의 수를 출력하세요.
[힌트]
세 개의 주사위 이므로 3번의 중첩 반복문 사용 후,
조건에 해당하는 숫자들만 출력.
(이때 조건에서는 '엄격한 동등 비교 연산자(===)'를 사용하도록 권고 )
📌 과제5
[html 파일]
숫자 맞추기 게임.
html 내에 script 태그를 삽입하여 자바스크립트 코드를 작성합니다.
컴퓨터가 1~10까지의 숫자 중 임의의 수를 선택하면, 프롬프트 창을 통해 사용자가 숫자를 입력합니다.
정답이 아닐 경우, 입력한 숫자에 대해 UP 또는 DOWN으로 힌트를 주는 창이 떠야합니다.
정답을 맞힌 경우 정답입니다와 함께 몇 번째 시도 만에 맞췄는지 알려주도록 구현합니다.
// 버튼 클릭시 게임 시작하게 하는 이벤트 핸들러 코드입니다.
// 이 내용은 아직 안 배워서 알려드립니다. 아래쪽에 추가하세요.
document.getElementById("startGame").onclick = startGame;
- 참고 -
prompt(" 문자 "); // prompt(입력창) 출력
alert(" 문자 "); // alert창(알림창) 출력
랜덤 변수 함수
Math.floor(Math.random( )) 사용
*Math.floor( ) : 소수점 이하 버림하고 정수만 남기는 함수.
*Math.random( ) : 0이상 1미만의 난수 생성 함수.
조건문 사용해야 함.
출력값이 좀 많이 나올텐데, 경우의 수가 많아서 그런 거라 그게 답 맞습니다! (27개)
'공부 > GDG' 카테고리의 다른 글
React 프로젝트 생성 (0) | 2024.10.30 |
---|---|
Javascript 2 DOM (5) | 2024.10.07 |
Javascript 1-4 연산자 (0) | 2024.09.30 |
Javascript 1-3 제어문 (0) | 2024.09.30 |
Javascript 1-2 변수와 데이터 타입 (0) | 2024.09.29 |