JavaScript-10 Math对象

一、Math对象

　　Math对象即数学对象。

二、数学对象的属性。

　　Math.PI :返回圆周率（约等于3.14159）

三、数学对象的方法

　　3.1 round(x); 把一个数四舍五入为最接近的整数。(看小数点后的第一位数)。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <script type="text/javascript">
            // 3.1 round(x); 把一个数四舍五入为最接近的整数。(看小数点后的第一位数)。
            var n = Math.round(3.1568);
            document.write(n); // 输出3
        </script>
    </body>
</html>

　　3.2 ceil(x); 对一个数进行上舍入。(小数部分不能全为0)。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <script type="text/javascript">
            // ceil(x); 对一个数进行上舍入。(小数部分不能全为0，只要有小数，就会往上进位)。
            var n = Math.ceil(3.1568);
            document.write(n); // 输出4
        </script>
    </body>
</html>

　　3.3 floor(x);对一个数进行下舍入。(小数部分不能全为0，不管小数部分多大数值，只看整数部分)。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <script type="text/javascript">
            //  floor(x);对一个数进行下舍入。(小数部分不能全为0，不管小数部分)。
            var n = Math.floor(3.9568);
            document.write(n); // 输出3
        </script>
    </body>
</html>

　　3.4 max(x,y)；返回x和y中的最大值。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <script type="text/javascript">
            //  max(x,y)；返回x和y中的最大值。
            var n = Math.max(9,5);
            document.write(n); // 输出9
        </script>
    </body>
</html>

　　3.5 min(x,y)；返回x和y中的最小值。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <script type="text/javascript">
            // min(x,y)； 返回x和y中的最小值。
            var n = Math.min(9,5);
            document.write(n); // 输出5
        </script>
    </body>
</html>

　　3.6 random()；返回0-1的随机数。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <script type="text/javascript">
            // random()；返回0-1的随机数。
            var n = Math.random();
            document.write(n); // 输出0-1的数，不等于1；
        </script>
    </body>
</html>

　　3.7 sqrt(x)；返回数的平方根。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <script type="text/javascript">
            // sqrt(x)；返回数的平方根。
            var n = Math.sqrt(16);
            document.write(n); // 输出4,4*4=16
        </script>
    </body>
</html>

　　3.8 abs(x)；返回数的绝对值。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <script type="text/javascript">
            // abs(x)；返回数的绝对值。
            var n = Math.abs(-7);
            document.write(n); // 输出7
        </script>
    </body>
</html>

　　3.9 pow(x,y)；返回x的y次幂。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <script type="text/javascript">
            // pow(x,y)；返回x的y次幂。。
            var n = Math.pow(2,3);
            document.write(n); // 输出8；2*2*2=8
        </script>
    </body>
</html>

四、练习

　　1.点击一个div框，每点击一次就会出现不同的颜色。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            #dd{
                width: 200px;
                height: 200px;
                border: 1px solid red;
                margin-top: 200px;
                margin-left: 200px;
            }
        </style>
    </head>
    <body>
        <div id="dd"></div>
    </body>
    <script type="text/javascript">
        var div=document.getElementById("dd");
        div.onclick=function(){
        //this.style.backgroundColor="rgb(233,123,80)";
        
        //使用到 数学对象中的 随机函数
        //js 中的随机数 Math.random()，只能产生[0~1)
        //js 中四舍五入 Math.round(值)，四舍五入
        var r= Math.round(Math.random()*255);
        var g= Math.round(Math.random()*255);
        var b= Math.round(Math.random()*255);
        
        this.style.backgroundColor="rgb("+r+","+g+","+b+")";
        };
    </script>
</html>

　　2.求100~1000以内的“水仙花数”

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
    </body>
    <script type="text/javascript">
        //2.求100~1000以内的“水仙花数”
        for(var i=100;i<1000;i++){
            var g=i%10;// 获取各位数
            var s= Math.floor(i/10)%10; // 获取十位数
            var b=Math.floor(i/100); // 获取百位数
            var res= Math.pow(g,3)+Math.pow(s,3)+Math.pow(b,3);
            if(i==res){
                document.write(i);
                document.write("<br>");
            }
            
        }
    </script>
</html>

刷新页面返回顶部

越努力越幸运

JavaScript-10 Math对象

公告