자바스크립트 랜덤 숫자 예제
자바스크립트를 통해 랜덤한 숫자를 뽑는 경우가 종종 있습니다.
대부분의 경우는 사용자에게 같은 데이터가 아닌 계속 변하는 데이터를 보여주어야 할 경우인데요.
예를 들면 뽑기 게임 이라든지, 두더지 게임처럼 임의의 숫자가 필요할 경우에 많이 사용합니다.
간단한 예제를 통해서 랜덤한 숫자를 뽑는 알고리즘을 보도록 하죠.
랜덤한 숫자를 뽑기위해 다음과 같은 변수와 공식들이 필요합니다.
1. 0과 1사이의 랜덤 숫자의 정수값을 저장할 변수
2. 0-20의 숫자를 구하기 위해 변수에 곱하기 20을 합니다. 수의 범위는 원하는 만큼 변경.
3. 그런 다음 소수점 이하는 반올림 합니다.
4. 결과값이 0이 나올 경우 1로 치환합니다.
자바스크립트 랜덤 숫자 따라해보기.
스크립트 코드)
<script>
function randomNumber(){
var iValue = Math.random(); // 0과 1사이의 랜덤 숫자 생성
iValue *= 20; //1에서 20 사이를 범위값을 얻기 위해 20을 곱한다.
}
alert(iValue);
}
</script>
HTML 코드)
<body>
<input type="button" onclick="randomNumber()" value="랜덤숫자">
</body>
결과)
위 결과처럼 정수의 랜덤한 숫자를 결과값으로 가져옵니다.
그럼 이제는 랜덤한 숫자를 가져오기 위한 공식까지 넣어서 결과를 보도록 하겠습니다.
스크립트 코드)
<script>
function randomNumber(){
var iValue = Math.random(); // 0과 1사이의 랜덤 숫자 생성
iValue *= 20; //1에서 20 사이를 범위값을 얻기 위해 20을 곱한다.
iValue = Math.floor(iValue); //소수점 이하 자리는 반올림한다.
//0이 나올경우 1로 치환
if(iValue < 1){
iValue = 1;
}
alert(iValue);
}
</script>
HTML 코드)
<body>
<input type="button" onclick="randomNumber()" value="랜덤숫자">
</body>
결과)
1. 크롬 브라우저
2. 익스플로러
3. 스윙 브라우저
전체코드)
<!doctype html>
<html lang="ko">
<head>
<meta charset="UTF-8">
</head>
<script>
function randomNumber(){
var iValue = Math.random(); // 0과 1사이의 랜덤 숫자 생성
iValue *= 20; //1에서 20 사이를 범위값을 얻기 위해 20을 곱한다.
iValue = Math.floor(iValue); //소수점 이하 자리는 반올림한다.
//0이 나올경우 1로 치환
if(iValue < 1){
iValue = 1;
}
alert(iValue);
}
</script>
<body>
<input type="button" onclick="randomNumber()" value="랜덤숫자">
</body>
</html>
자바스크립트 랜덤 숫자.. 이 포스트가 유용하였다
면부탁드립니다.
'코딩이야기 > Javascript' 카테고리의 다른 글
| 자바스크립트 모바일 접속기기 체크 (0) | 2017.02.01 |
|---|---|
| 자바스크립트와 제이쿼리의 선택자 - 자바스크립트 강좌 9강 (2) | 2016.11.10 |
| 자바스크립트 이메일 검증 - 자바스크립트 강좌 8강 (0) | 2016.11.09 |
| 자바스크립트 폼 유효성 검증 - 자바스크립트 강좌 7강 (0) | 2016.11.08 |
| 자바스크립트 이벤트 - 자바스크립트 강좌 6강 (5) | 2016.06.04 |