랜덤으로 영어 문자열을 생성하고 싶다면??
오늘은 자바스크립트에서 랜덤으로 문자열을 생성하는 방법을 간단하게 알아보겠습니다.
구글 같은 곳에서는 페이지별로 다른 비밀번호를 사용할 수 있게끔 자동 비밀번호 생성 기능을 제공해 주죠.
그런 자동으로 생성되는 문자열은 어떻게 만들 수 있을까요?
우선 자바스크립트에서 random함수부터 살펴보도록 하겠습니다.
Math.romdom()
Math.random() 메서드는 0에서 1 사이의 난수를 반환하는 기능을 가지고 있습니다.
그런데 특정 범위의 int값으로 난수를 받고 싶다면 어떻게 해야 할까요?
function getRandomInt(max) {
return Math.floor(Math.random() * (max+1));
}
Math에는 올림, 반올림, 내림을 할 수 있는 메서드가 있습니다
- Math.ceil은 소수점을 올림 하는 메서드입니다.
- Math.round는 소수점을 반올림하는 메서드입니다.
- Math.floor는 소수점을 내림하는 메서드입니다.
정수 값으로 난수를 받고 싶기 때문에 Math.floor를 사용해서 소수점을 버립니다.
이렇게 하면 최대 max값인 정수 하나를 랜덤으로 받을 수 있습니다.
참고로 Math.random()은 0은 포함되고 1은 포함 안 되는 난수를 반환하기 때문에
max+1을 해주어야 max값도 포함되어 나올 수 있습니다.
(예를 들어 max값이 5라고 치고 Math.random()이 0.999가 나왔다고 치면 Math.floor()로 인해 결국 4가 나오게 된다)
여기서 만약 최솟값, 최댓값 범위를 지정하고 싶다면 어떻게 할까요?
function getRandomIntInclusive(min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min + 1) + min);
}
이와 같이 해주시면 최소값 최대값 범위도 정해서 난수를 하나 받을 수 있습니다.
그럼 이제 숫자가 아닌 문자를 랜덤으로 받기 위해서는 어떻게 해야 할까요?
charAt()
charAt() 함수는 매개변수 값으로 index 값을 넣습니다.
그리고 해당 인덱스에 위치하는 유니코드 단일 문자를 반환합니다.
const sentence = "안녕하세요 행복한 알파카입니다!";
const char = sentence.charAt(6);
console.log(char) // "행" 값 반환
이를 이용해서 랜덤 정수값을 영어문자를 모아둔 문자열의 charAt에 인덱스로 넣어주면 랜덤 문자 하나를 얻을 수 있습니다.
const characters = "abcdefghijklmnopqrstuvwxyz";
const randomCharacters = characters.charAt(Math.floor(Math.random() * characters.length);
console.log("random value: ", randomCharacters);
characters에 숫자를 적어둔다면 숫자까지 생성 범위에 들어가게 됩니다.
랜덤 문자열 생성하기
이제 두 개를 합쳐서 랜덤 문자열 생성하는 방법을 알아보겠습니다.
try {
const characters = "abcdefghijklmnopqrstuvwxyz0123456789";
let result = "";
const charactersLength = characters.length;
for (let i = 0; i < num; i++) {
result += characters.charAt(Math.floor(Math.random() * charactersLength));
}
return result;
} catch (error) {
console.warn("generateRandomValue Error:", error);
}
};
이렇게 characters에 랜덤생성하고 싶은 문자, 숫자등을 입력해 두고 해당 문자열의 길이를 아까 예시에서 Max로 보고 범위를 설정해 주면 랜덤 한 정수를 받을 수 있고, 그것을 charAt()의 인수로 넣어서 랜덤 문자를 생성합니다.
생성된 문자는 result에 추가해 주면 랜덤 문자열 생성이 가능합니다.
생각보다 쉽죠?? ㅎㅎ
'IT > javascript' 카테고리의 다른 글
[javascript] range slider 양옆에 버튼을 두고 25% 단위로 값 조절하는 함수 만들기 (0) | 2023.08.02 |
---|---|
[javascript] 특정 시간만큼 대기시키는 함수 만들기(setTimeout(), Promise, async await) (1) | 2023.08.01 |
[javascript] 객체가 빈 값인지 확인하는 방법 (0) | 2023.01.27 |