JS基础-Math内置对象
2019-02-27 本文已影响65人
壹枕星河
Math 对象并不像 Date 和 String 那样是对象的类,因此没有构造函数 Math()。
math内置对象.png
math对象方法.png
语法:
var x = Math.PI; // 返回PI
var y = Math.sqrt(16); // 返回16的平方根
Math.random()生成一个从0-1(包含0不包含1)的随机小数
生成 min ~ max (min < max)的随机数公式:
Math.random()*(max - min) + min
案例1:抽奖程序
<p>中午谁请吃饭?</p>
<h1></h1>
<button>抽奖</button>
<script>
var h1 = document.getElementsByTagName("h1")[0];
var btn = document.getElementsByTagName("button")[0];
var str = "毛方海,何周帅,王思维,李美琪";
btn.onclick = function(){
var arr = str.split(",");
//0 - length-1随机数
var index = Math.floor(Math.random()*(arr.length));
console.log(index);
h1.innerHTML = arr[index];
}
案例2:try
<script>
var num = 20;
num = "20";
//.... 对num进行一系列的计算,有可能计算结束之后变成"30"
try{
console.log(num.slice(0,1));
}catch(e){
console.log(e); //Error对象
}
console.log(123);
</script>
案例3:随机验证码
<h1></h1>
<script>
//0-9 48-57
//a-z 97-122
//A-Z 65-90
function randomChar(){
var arr = new Array(3);
arr[0] = String.fromCharCode(Math.floor(Math.random()*10+48));
arr[1] = String.fromCharCode(Math.floor(Math.random()*26+97));
arr[2] = String.fromCharCode(Math.floor(Math.random()*26+65));
return arr[Math.floor(Math.random()*arr.length)];
}
var str = "";
for(var i = 0; i < 4; i++){
str += randomChar();
}
document.getElementsByTagName("h1")[0].innerHTML = str;
//var str1="0123456789abcdefgABCDEFG";
</script>
案例4:点击给div随机切换背景颜色
<div id="box" style="width: 200px;height: 200px;background: red;"></div>
<button>按钮</button>
<script>
var box = document.getElementById("box");
var str = "0123456789abcdef";
document.getElementsByTagName("button")[0].onclick = function(){
var color = "#";
for(var i = 0; i < 6; i++){
color += str.charAt(parseInt(Math.random()*str.length));
}
box.style.background = color;
}
猜数字游戏
<script>
var randNum = Math.ceil(Math.random()*100);
var count = 0;
do{
count++;
var num = Number(prompt("请输入一个1-100的数字"));
if(num > randNum){
alert("猜大了");
}else if(num < randNum){
alert("猜小了");
}
}while(num != randNum);
alert("猜对了,您一共猜了"+count+"次");
</script>