Math method practice
.random .floor .ceil .min .max
by trentHarlem
HTML
<h2>
Math Methods
</h2>
<div id='random'>
<em>.random</em> 1 Random Number:<br>
</div><br>
<div id='ten'>
<em>.floor</em> Array of 10 Random Numbers:<br>
Rounded Down
</div>
<blockquote>
<div id='min'>
<em>.min</em>
</div>
<br>
<div id='max'>
<em>.max</em>
</div>
</blockquote>
<br>
<div id='color'>
Background color generated using <br>
Random Numbers:
</div>
CSS
* {
font: 22px system-ui;
}
#color {
padding: 10px;
height: auto;
width: 100%;
}
em {
font-style: italic;
}
JavaScript
let arr = []
document.getElementById("random").innerHTML += `${Math.random()} `;
function random10() {
for (let i = 0; i < 10; i++) {
let num = `${Math.floor(Math.random()*10)} `
//arr.push(num)
arr.push(Math.floor(Math.random()*10))
}
document.getElementById("ten").innerHTML += `${arr}`;
}
random10()
arrMin = (n) => {
console.log('arrMin',arr)
let min = Math.min(...n)
document.getElementById("min").innerHTML += `The Lowest number: ${min}`;
}
arrMin(arr)
arrMax = (n) => {
let max = Math.max(...n);
document.getElementById("max").innerHTML += `The Highest number: ${max}`;
}
arrMax(arr)
function randomColor() {
let red = `${Math.ceil(Math.random()*200 + 55)}`
let green = `${Math.ceil(Math.random()*200 + 55)}`
let blue = `${Math.ceil(Math.random()*200 + 55)}`
document.getElementById("color").innerHTML += `rgb(${red},${green},${blue})`
document.getElementById("color").style.backgroundColor = `rgb(${red},${green},${blue})`;
}
randomColor()