[JavaScript] Math 數學運算

[JavaScript] Math 數學運算

Math物件

JavaScript的Math物件可以執行方法做數學的運算。

 

Math.round( )

Math.round(x) : 將x四捨五入到整數。

<!DOCTYPE html>
<html>
<body>

    <p id="demo"></p>

    <script>
        document.getElementById("demo").innerHTML = Math.round(4.4);
    </script>

</body>
</html>

Math.round(4.4) 將4.4四捨五入為4。

 

Math.pow( )

Math.pow(x,y) : 返回x的y次方。

<!DOCTYPE html>
<html>
<body>

    <p id="demo"></p>

    <script>
        document.getElementById("demo").innerHTML = Math.pow(7,2);
    </script>

</body>
</html>

Math.pow(7,2) 返回7的2次方,即為7X7=49。

 

Math.sqrt( )

Math.sqrt( ) : 返回x的平方根。

<!DOCTYPE html>
<html>
<body>

    <p id="demo"></p>

    <script>
        document.getElementById("demo").innerHTML = Math.sqrt(49);
    </script>

</body>
</html>

Math.sqrt(49) 表示49的平方根,即為\( \sqrt 49 \)=7。

 

Math.abs( )

Math.abs(x) : 將x轉成正數。

<!DOCTYPE html>
<html>
<body>

    <p id="demo"></p>

    <script>
        document.getElementById("demo").innerHTML = Math.abs(-1.23);
    </script>

</body>
</html>

Math.abs(-1.23) 將數字-1.23轉回正數1.23。

 

Math.ceil( )

Math.ceil(x) : 將x往上加到整數。

<!DOCTYPE html>
<html>
<body>

    <p id="demo"></p>

    <script>
        document.getElementById("demo").innerHTML = Math.ceil(1.23);
    </script>

</body>
</html>

Math.ceil(1.23) 將數字1.23往上計算到整數2。

 

Math.floor( )

Math.floor(x) : 將x往下減到整數。

<!DOCTYPE html>
<html>
<body>

    <p id="demo"></p>

    <script>
        document.getElementById("demo").innerHTML = Math.floor(1.9);
    </script>

</body>
</html>

Math.floor(1.9) 將數字1.9往下計算到整數1。

 

Math.min( ) 

Math.min() : 找出參數列表中最小的值。

<!DOCTYPE html>
<html>
<body>

    <p id="demo"></p>

    <script>
        document.getElementById("demo").innerHTML = Math.min(1,0,15,200,100);
    </script>

</body>
</html>

Math.min(1,0,15,200,100) 返回參數列表中最小的數字0。

 

Math.max( )

Math.max() : 找出參數列表中最大的值。

<!DOCTYPE html>
<html>
<body>

    <p id="demo"></p>

    <script>
        document.getElementById("demo").innerHTML = Math.max(1,0,15,200,100);
    </script>

</body>
</html>

Math.max(1,0,15,200,100) 返回參數列表中最大的數字200。

 

Math.random( )

Math.random() : 返回0(包含)和1(不包含)之間的隨機數字。

<!DOCTYPE html>
<html>
<body>

    <p id="demo"></p>

    <script>
        document.getElementById("demo").innerHTML = Math.random();
    </script>

</body>
</html>

Math.random() 返回一個隨機的浮點數,介於0~1之間,大於等於0、小於1。

 

random( ) 返回整數

由於Math.random()只會回傳0到1之間的隨機小數點,可以用Math.random()與Math.floor()方法返回隨機整數。

<!DOCTYPE html>
<html>
<body>

    <p id="demo"></p>

    <script>
        document.getElementById("demo").innerHTML = Math.floor(Math.random()*10);
    </script>

</body>
</html>

原本的Math.random()方法會返回0~1的浮點數。顯示0.0000000000000000~0.9999999999999999。

Math.random()*10 將random()方法返回的浮點數乘以10。顯示0.0000000000000000~9.9999999999999999。

Math.floor(Math.random()*10) 將乘上10的隨機數字用floor()方法往下計算到整數。顯示0~9。

 

上面的例子返回0~9的隨機整數,若要返回1~10的隨機整數,只需要在最後面加上1即可:

<!DOCTYPE html>
<html>
<body>

    <p id="demo"></p>

    <script>
        document.getElementById("demo").innerHTML = Math.floor(Math.random()*10)+1;
    </script>

</body>
</html>

原本的Math.random()方法會返回0~1的浮點數。顯示0.0000000000000000~0.9999999999999999。

Math.random()*10 將random()方法返回的浮點數乘以10。顯示0.0000000000000000~9.9999999999999999。

Math.floor(Math.random()*10) 將乘上10的隨機數字用floor()方法往下計算到整數。顯示0~9。

Math.floor(Math.random()*10)+1 將返回的0~9隨機整數最後再加上1。顯示1~10。

 

使用Function返回隨機數字

將Math.random()與Math.floor()方法寫進function來返回隨機的數字。

 

從兩個數字中隨機取一個整數,最小數(包含)~最大數(不包含):

<!DOCTYPE html>
<html>
<body>

    <p id="demo"></p>

    <script>
        function random(min,max)
        {
            return Math.floor(Math.random() * (max - min)) + min;
        }
        document.getElementById("demo").innerHTML = random(0, 10);
    </script>

</body>
</html>

function random(min,max) 定義一個function名為getRandomNumber,有參數min與max。

return Math.floor(Math.random() * (max - min)) + min 返回隨機數字乘上(max-min),並用floor()方法往下計算到整數,最後再加上min。

getRandomNumber(0, 10) 即為Math.floor(Math.random() * (10- 0)) + 0,相當於Math.floor(Math.random()*10)。顯示0~9。

 

 

從兩個數字中隨機取一個整數,最小數(包含)~最大數(包含):

<!DOCTYPE html>
<html>
<body>

    <p id="demo"></p>

    <script>
        function getRandomNumber(min,max)
        {
            return Math.floor(Math.random() * (max - min+1)) + min;
        }
        document.getElementById("demo").innerHTML = getRandomNumber(1, 10);
    </script>

</body>
</html>

function random(min,max) 定義一個function名為getRandomNumber,有參數min與max。

return Math.floor(Math.random() * (max - min+1)) + min 返回隨機數字乘上(max-min+1),並用floor()方法往下計算到整數,最後再加上min。

getRandomNumber(0, 10) 即為Math.floor(Math.random() * (10- 1+1)) + 1,相當於Math.floor(Math.random()*10)+1。顯示0~10。

 

 END 

回目錄