Math对象(javasript)

Math对象

提供基本数学功能和常量的内部对象。

与 String、Date 对象不同的是，Math 对象并不是对象的类，没有构造函数 Math()，因此无需创建 Math
对象而可以直接使用 Math 对象。同样的，Math 对象内的方法也是静态方法，可以通过 Math.function 的方式直接使用

语法

Math.[{property | method}]

参数

属性

必需。 Math 的某个属性的名称。

方法

必需。 Math 的某个方法的名称。

Math对象的常量

返回的常量	描述
Math.E 常量	返回算术常量 e，即自然对数的底数（约等于2.718）。
Math.LN2 常量	返回 2 的自然对数（约等于0.693）。
Math.LN10 常量	返回 10 的自然对数（约等于2.302）。
Math.LOG2E 常量	返回以 2 为底的 e 的对数（约等于 1.414）。
Math.LOG10E 常量	返回以 10 为底的 e 的对数（约等于0.434）。
Math.PI 常量	返回圆周率（约等于3.14159）。
Math.SQRT1_2 常量	返回返回 2 的平方根的倒数（约等于 0.707）。
Math.SQRT2 常量	返回 2 的平方根（约等于 1.414）。

Math对象的函数方法

函数	描述
Math.abs(x) 函数	返回数字的绝对值。
Math.acos(x) 函数	返回数的反余弦值。
Math.asin(x) 函数	返回数的反正弦值。
Math.atan(x) 函数	以介于 -PI/2 与 PI/2 弧度之间的数值来返回 x 的反正切值。
Math.atan2(y,x) 函数	返回从 x 轴到点 (x,y) 的角度（介于 -PI/2 与 PI/2 弧度之间）。
Math.ceil(x) 函数	返回大于或等于提供的数值表达式的最小整数。
Math.cos(x) 函数	返回数的余弦。
Math.exp(x)函数	返回 e 的指数。
Math.floor(x)函数	对数进行下舍入。
Math.log(x)函数	返回数的自然对数（底为e）。
Math.max(x,y)函数	返回 x 和 y 中的最高值。
Math.min(x,y)函数	返回 x 和 y 中的最低值。
Math.pow(x,y)函数	返回 x 的 y 次幂。
Math.random()函数	返回 0 ~ 1 之间的随机数。
Math.round(x)函数	把数四舍五入为最接近的整数。
Math.sin(x)函数	返回数的正弦。
Math.sqrt(x)函数	返回数的平方根。
Math.tan(x)函数	返回角的正切。
Math.toSource()函数	返回该对象的源代码。
Math.valueOf()函数	返回 Math 对象的原始值。

练习

1、生成 1-10之间的随机数
简单的写法：

<script>
    document.write(Math.random()*10+1);
</script>

或者

<script>
    var rand=Math.random()*10+1;
    document.write(rand);
</script>

2、生成10个 1-100之间的随机数
简单的写法：

<script>
    for (var i = 0; i < 9; i++) {
        document.write(Math.random()*100+1+"<br>");
    };
</script>

3、生成一个满屏的像这样的

代码：

<script>
function fn(){
    //删掉之前的内容
    document.body.innerHTML = "";
    //获取可视窗口的宽高
    var wW = document.documentElement.clientWidth;
    var wH = document.documentElement.clientHeight;
    //每一个小div的宽高
    var divW = wW/10;
    var divH = wH /10;
    //创建文档碎片,优化页面性能，减少页面多余节点
    var fra = document.createDocumentFragment();
    // var div = document.createElement("div");//会多一个div节点
    //创建10行的div
    for (var j = 0; j <10; j++) {
        //创建10个div
        for (var i = 0; i <10; i++) {
            var oDiv = document.createElement("div");
            oDiv.style.height = divH + "px";
            oDiv.style.width = divW + "px";
            oDiv.style.position = "absolute";
            oDiv.style.top = j*divH+"px";
            oDiv.style.left = i*divW+"px";
            //让颜色随机
            var r = Math.floor(Math.random()*256);
            var g = Math.floor(Math.random()*256);
            var b = Math.floor(Math.random()*256);
            oDiv.style.background = "rgb("+r+","+g+","+b+")";
            // document.body.appendChild(oDiv);//循环插入会影响性能
            //把创建的div插入到文档碎片fra中
            fra.appendChild(oDiv);
            // div.appendChild(oDiv);
        }
    };
    //把fra文档碎片插入到body中
    document.body.appendChild(fra);
    // document.body.appendChild(div);
}
window.onload=window.onresize = fn;
</script>

如果加上一个计时器，便会出现一个动态效果。大家可以尝试一下