반응형
배열에서 무작위로 이름을 뽑는 방법
- random()함수: 랜덤 숫자를 생성하는 함수
- chooseName(): random()함수를 사용하여 매개변수로 선택할 배열을 취하고 결과를 반환하는 함수
- resultChoice(): 버튼 클릭시 랜덤으로 뽑힌 이름을 출력하는 함수
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>randomChoice</title>
</head>
<body>
<div>
<div>
<p id="list"></p>
<button id = "btn">선택</button>
</div>
<p id= "para"></p>
</div>
<script type="text/javascript">
const names = ['Chris','Mike','Anna','JJinTodo','Tina','Lee',"Tay"];
const para = document.getElementById('para');
const list = document.querySelector("#list");
list.textContent = '후보 ' + names;
//랜덤 숫자 출력 함수
function random(min,max){
const num = Math.floor(Math.random()*(max - min))+min;
return num;
}
//names list에서 랜덤으로 이름 선택하는 함수
function chooseName(array){
const choice = array[random(0,array.length)];
return choice;
}
// 버튼 클릭시 결과 출력
const btn = document.querySelector("#btn");
btn.addEventListener('click',resultChoice);
function resultChoice(){
para.textContent = '당첨자는' + chooseName(names) + '입니다.';
}
</script>
</body>
</html>실행결과
mdn 함수 실력 테스트 문제3을 참고하여 작성해봤습니다.
실력을 평가해 보세요: 함수 - Web 개발 학습하기 | MDN
이 실력 테스트의 목적은 여러분이 우리의 함수 — 코드 재사용, 함수 만들기, 그리고 함수 반환 값 문서를 이해했는지 평가하기 위함입니다.
developer.mozilla.org
반응형
'Java script' 카테고리의 다른 글
| JavaScript_자바스크립트 클로저 (0) | 2022.09.21 |
|---|---|
| 자바스크립트-프로토타입2_자바스크립트와 객체 지향 프로그래밍 (0) | 2022.09.19 |
| JavaScript_자바스크립트 Math.random() 외 난수 생성하는 방법 (0) | 2022.08.16 |
| JavaScript_프로토타입1 (0) | 2022.08.16 |
| Javascript_이메일 형식 확인 정규식, 핸드폰 번호 형식 자동 적용 정규식 (0) | 2022.08.09 |
