여러 개의 정보들 중에서 랜덤한 정보를 선택하려고 할때
Random 함수를 많이 사용한다
여러 개의 이미지 중에 랜덤한 이미지를 사용하려고 Math.random()
함수를 사용해보았다
Math.random()
자바스크립트의 랜덤함수 이다
0 부터 1 미만의 숫자를 무작위로 리턴해준다
1 2
| const randomNum = Math.random(); console.log(`random Number = ${randomNum}`);
|
특정 범위 내의 값을 얻고 싶을 때
random 에 원하는 값을 곱해주면 된다
0 부터 10 미만까지에서 랜덤으로 숫자를 얻고 싶으면
1 2
| const randomNum = Math.random() * 10; console.log(`random Number = ${randomNum}`);
|
랜덤 정수를 얻는 방법
Math.floor()
사용하면 정수를 얻을 수 있다. 소수점 이하는 내림한다.
1 2 3
| const randomNum = Math.random() * 10; const randomInt = Math.floor(randomNum); console.log(`random Int = ${randomInt}`);
|
특정 배열에서 랜덤한 정보를 얻는 방법
배열의 length 를 곱해주면 된다
아래는 unsplash.json
파일을 받아서 해당 json 의 length 중에
한개를 랜덤하게 사용하는 예제 이다.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
| const randomizePicture = () => { const bannerwd = document.getElementById("bannerwd").value; const bannerhg = document.getElementById("bannerhg").value;
$.getJSON("unsplash.json", function (json) { const randomNum = Math.floor(Math.random() * json.length); document.getElementById("banner-url").value = json[randomNum].url + "?auto=format&fit=crop&w=" + bannerwd * 1.5 + "&h=" + bannerhg * 1.5 + "&q=90"; console.log(randomNum); getURLImage(); }); };
|