[JavaScript] 요즘 유행하는 Wordle 따라하면서 만들어 보기-4

문제점

지금은 한 가지의 답안만을 가지고 있습니다

하나의 정답만 사용할 수 있습니다

기능 개선

여러 가지 정답을 가지고 그중에서 하나를 사용하는 방식으로 변경하겠습니다

방법은 배열을 통해서 여러 가지 정답을 가지고 랜덤으로 호출되게 변경하도록 하겠습니다

//정답
const answer = 'basic';

지금은 "answer" 변수에 하나의 답만 가지고 있습니다

별도의 정답 목록을 가지고 answer의 답안을 변경하도록 하겠습니다

정답을 모은 answerList 변수를 만듭니다

//정답 목록
const answerList = ['basic', 'black', 'bread', 'clean', 'chair', 'count', 'drink'];

정답 목록을 만들었습니다

이제 answer에서 이 중에서 하나의 값을 가져오도록 변경하겠습니다

javascript에서 기본적으로 Math 함수를 제공합니다

Masth 함수 중 랜덤(random) 함수가 있습니다

0~1 사이의 난수를 뽑아주는 함수로 이걸 사용해서 랜덤으로 정답 목록을 가져오겠습니다

사용방법

Math.random()

일반 함수 호출 방법 동일하게 사용 가능합니다

Math.random()*숫자

Math.random()*숫자 입력하면 원하는 랜덤 숫자의 범위를 지정할 수 있습니다

하지만 값을 입력해보면 뒤에 소수점이 나오기 때문에 Math.floor() 함수를 사용하면 소수점을 버림 할 수 있습니다

이 두 함수를 조합하면 원하는 범위의 숫자를 만들 수 있습니다

"Math.floor(Math.random()*숫자);"

숫자 부분에 배열 목록의 수를 반환하는 "length"를 사용해서 배열의 숫자만큼 범위를 지정합니다

여기서 "-1"을 추가합니다 이유는

배열은 0부터 시작하기 때문에 -1을 통해서 최소값이 0이 나오게 합니다

"-1"이 없을 경우 최소 값이 1, 최대 값이 7이 나오게 됩니다

"answerList [랜덤 숫자]|" 방식으로 이제 정답 목록에서 원하는 답이 나옵니다

//정답 목록
const answerList = ['basic', 'black', 'bread', 'clean', 'chair', 'count', 'drink'];
//정답
const answer = answerList[Math.floor(Math.random()*(answerList.length-1))];

 

이제 정답은 목록을 통해서 정답을 관리할 수 있게 되었습니다