코딩을 하기 전에 먼저 어떻게 할지 정리를 한번 해 봅니다.
1. 1~45의 숫자들 무작위로 한개를 추출한다.
2. 추출한 숫자가 기존과 겹쳤을 때는 다시 추출한다.
3. 이렇게 추출한 숫자를 총 6개로 만든다.
4. 1~3 의 방법으로 보통 로또종이가 5게임이니 5개를 만든다.
자바스크립트에서 무작위 추출은 보통 수학 객체(Math)의 랜덤을 많이 이용합니다.
그런데 Math.random은 0~1 사이의 숫자를 랜덤하게 반환하기 때문에
여기에 로또의 1~45의 숫자를 만들려면 45를 곱해주어야 합니다.
또한 이것을 다시 정수로 만들어 주어야 합니다. 이때 쓸 수 있는 것이 바로 Math.foor() 이죠 ...
그러므로 수식은 아래처럼 됩니다.
k = Math.floor(Math.random()*45);
alert(k)
그런데 이럴경우 간혹가다 0이 나오는 경우고 있고 또한 맥시멈 값이 44로 나옵니다.
이것을 해결하기 위해서는 뒤에 1를 더해 줍니다.
일단 alert(k) 으로 제대로 숫자가 나오는지 확인 해 봅니다.
그러므로 수식은 아래처럼 됩니다.
k = Math.floor(Math.random()*45)+1;
alert(k)
이제 여섯 개를 추출해 봅시다.
이때는 반복문 for 문을 써서 로또 번호가 6 자리이니 6번 값을 내면 됩니다.
for (i=0;i<6 ;i++)
{
k = Math.floor(Math.random()*45)+1;
document.write(k+',');
}
그런데 결과 값을 확인하면 새로고침을 계속 눌렀을 때 간혹 가다 같은 숫자가 다시 나오는 경우가 생깁니다.
이런 경우 값을 배열에 넣어서 한꺼번에 확인 하는 것이 낫기 때문에 일단 배열을 만듭니다.
var lotto =[];
for (i=0;i<6 ;i++)
{
k = Math.floor(Math.random()*45)+1;
lotto.push(k) // 배열에 순차적으로 넣는다.
}
document.write('lotto---> '+lotto);
가끔가다 아래와 같은 결과값이 나오는 경우가 생깁니다. 숫자가 겹친 것이죠.
이런 문제를 해결하기 위해서는 숫자가 겹치면 다시 숫자를 추출하면 되겠죠?
php 에서는 in_array 라는 함수가 있는데 이것은 배열안에 같은 값이 존재하는지 확인 해 주는 함수입니다.
불행하게도 자바스크립트에는 in_array라는 함수가 없어요. 그렇지만 쉽게 만들 수 있습니다.
function in_array(val,arr)
{
for (var i=0;i<arr.length;i++)
{
if (arr[i] == val) return true;
}
return false;
}
코드에 적용을 해봅니다.
그런데 for 문의 증가값은 lotto 배열에 값을 정상적으로 입력했을 때만 증가시켜야 하므로
기존 for 문의 증가값 i++ 을 lotto 배열 뒤로 위치를 옮겨 줍니다.
var lotto =[];
for (i=0;i<6 ;)
{
k = Math.floor(Math.random()*45)+1;
if (!in_array(k,lotto))
{
lotto.push(k) // 배열에 순차적으로 넣는다.
i++;
}
}
document.write('lotto---> '+lotto);
function in_array(val,arr)
{
for (var i=0;i<arr.length;i++)
{
if (arr[i] == val) return true;
}
return false;
}
여러번 새로고침을 해봅니다. 혹시나 숫자가 겹치는지 ....
이상이 없으면 이제 숫자를 순서대로 정렬을 해봅니다.
정렬은 간단합니다. 바로 sort()를 쓰면 되거든요.
var lotto =[];
for (i=0;i<6 ;)
{
k = Math.floor(Math.random()*45)+1;
if (!in_array(k,lotto))
{
lotto.push(k) // 배열에 순차적으로 넣는다.
i++;
}
}
lotto.sort(); // 배열을 정렬한다.
document.write('lotto---> '+lotto);
function in_array(val,arr)
{
for (var i=0;i<arr.length;i++)
{
if (arr[i] == val) return true;
}
return false;
}
그런데 새로고침을 계속 하니 10 이하의 숫자인데 한번씩 뒤로 가는 경향이 있습니다.
이는 sort() 함수 내에서 파라메터를 생략할 경우 유니코드 순서대로 정렬하기 때문에
10이하의 숫자라도 예를 들자면 16보다 8이 큰 것으로 여기기 때문에 그렇습니다.
파라메터를 입력해서 이 문제를 해결하면
var lotto =[];
for (i=0;i<6 ;)
{
k = Math.floor(Math.random()*45)+1;
if (!in_array(k,lotto))
{
lotto.push(k) // 배열에 순차적으로 넣는다.
i++;
}
}
lotto.sort(function(a,b){return a-b;}); // 배열을 정렬한다.
document.write('lotto---> '+lotto);
function in_array(val,arr)
{
for (var i=0;i<arr.length;i++)
{
if (arr[i] == val) return true;
}
return false;
}
이제 한줄로 나오는 것은 만들어졌습니다.
그런데 최초 로또용지에 나와있는 갯수가 5개이니 그만큼 출력하기로 했었죠
for 문을 하나를 더 만들어줍니다. 변수가 겹치지 않게 i를 썼으니 j를 쓰구요.
for (j=1;j<=5 ;j++ )
{
var lotto =[];
for (i=0;i<6 ;)
{
k = Math.floor(Math.random()*45)+1;
if (!in_array(k,lotto))
{
lotto.push(k) // 배열에 순차적으로 넣는다.
i++;
}
}
lotto.sort(function(a,b){return a-b;}); // 배열을 정렬한다.
document.write(j+'번째 로또---> '+lotto +'<br>');
}
function in_array(val,arr)
{
for (var i=0;i<arr.length;i++)
{
if (arr[i] == val) return true;
}
return false;
}
결과값이 아래처럼 나오면 잘 된 것입니다.
어느 정도 만족스런 결과값이 나온 듯 하네요
브라우저의 새로고침 누르는 것도 살짝 귀찮죠. 그렇다면 버튼 하나 만들어서 새로고침도 하게끔 합니다...
완성된 html 과 합친 코드는 아래와 같습니다.
복사후 노트패드 열고 붙여넣기 '이름.html'로 저장하면 됩니다.
<html>
<head>
<title> 로또번호 생성기 </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
</head>
<body>
<script type="text/javascript">
<!--
for (j=1;j<=5 ;j++ )
{
var lotto =[];
for (i=0;i<6 ;)
{
k = Math.floor(Math.random()*45)+1;
if (!in_array(k,lotto))
{
lotto.push(k) // 배열에 순차적으로 넣는다.
i++;
}
}
lotto.sort(function(a,b){return a-b;}); // 배열을 정렬한다.
document.write(j+'번째 로또---> '+lotto +'<br>');
}
function in_array(val,arr)
{
for (var i=0;i<arr.length;i++)
{
if (arr[i] == val) return true;
}
return false;
}
//-->
</script>
<input type="button" onclick="location.reload()" value="재배열">
</body>
</html>
'웹프로그래밍 > javascript' 카테고리의 다른 글
| javascript 반짝이는 테이블 만들기 (1) | 2024.05.10 |
|---|---|
| 로또번호가 몇 번 나왔을까? (0) | 2024.03.15 |
| 자바스크립트로 구구단 짜기 (0) | 2024.03.07 |
