JavaScript内置对象-Math对象

最新推荐文章于 2023-10-08 18:08:06 发布

小码哥呀

最新推荐文章于 2023-10-08 18:08:06 发布

阅读量3.3k

点赞数 2

分类专栏： JavaScript 文章标签：前端 javascript

本文链接：https://blog.csdn.net/qq_46112274/article/details/121513659

版权

JavaScript 专栏收录该内容

50 篇文章 1 订阅

订阅专栏

本文介绍了JavaScript内置的Math对象，包括求最大值、封装数学工具、绝对值和取整方法、Math.Random()的随机数应用，以及实现猜数字游戏的示例。通过实际操作和应用场景，深入理解Math对象在编程中的实用性。

摘要由CSDN通过智能技术生成

1、内置对象

在这里插入图片描述

2、查文档

2.1、MDN

在这里插入图片描述

MDN官网：https://developer.mozilla.org/zh-CN/

MDN官网JavaScript文档：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript

2.2、如何学习对象中的方法

在这里插入图片描述

3、Math内置对象

3.1、求最大值

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        // Math数学对象 不是一个构造函数，所以我们不需要new来调用，而是直接使用里面的属性和方法即可
        console.log(Math.PI);//一个属性，圆周率
        console.log(Math.max(1,99,3));//99
        console.log(Math.max(-1,-10));//-1
        console.log(Math.max(1,99,'blue'));//NaN
        console.log(Math.max());//-Infinity
    </script>
</head>
<body>
    
</body>
</html>

在这里插入图片描述

3.2、封装自己的数学对象

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        // 利用对象封装自己的数学对象 里面有PI 最大值和最小值
        var myMath = {
            PI: 3.141592653,
            max :function(){
                var max = arguments[0];
                for(var i = 0;i<arguments.length;i++){
                    if(arguments[i]>max){
                        max = arguments[i];
                    }
                }
                return max;
            },
            min :function(){
                var min = arguments[0];
                for(var i = 0;i<arguments.length;i++){
                    if(arguments[i]< min){
                        min = arguments[i];
                    }
                }
                return min;
            }
        }
        console.log(myMath.PI);
        console.log(myMath.max(1,3,9));
        console.log(myMath.min(1,3,9));
    </script>
</head>
<body>
    
</body>
</html>

在这里插入图片描述

3.3、Math概述

在这里插入图片描述

3.3.1、Math绝对值和三个取整方法

注意Math.round()四舍五入方法有个特殊情况（遇到.5往大了取整）

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        // 1、绝对值方法
        console.log(Math.abs(1));//1
        console.log(Math.abs(-1));//1
        console.log(Math.abs('-1'));//隐式转换，会把字符串-1 转换为数字型
        console.log(Math.abs('pink'));//NaN
        
        //2、三个取整方法
        // (1)Math.floor() 地板 向下取整 王最小了取整
        console.log(Math.floor(1.1));//1
        console.log(Math.floor(1.9));//1
        // (2)Math.ceil() ceil 天花板 向上取整 往最大了取整
        console.log(Math.ceil(1.1));//2
        console.log(Math.ceil(1.9));//2
        // (3)Math.round() 四舍五入 其他数字都是四舍五入 但是.5 特殊 它往大了取
        console.log(Math.round(1.1));//1
        console.log(Math.round(1.5));//2
        console.log(Math.round(1.9));//2
        console.log(Math.round(-1.1));//-1
        console.log(Math.round(-1.5));//这个结果是 -1
        
        
        
        
    </script>
</head>
<body>
    
</body>
</html>

在这里插入图片描述

3.3.2、Math.Random()随机数方法、随机点名

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        // 1、Math对象随机数方法 random()返回一个随机的小数 0 =< x < 1
        // 2、这个方法里面不跟参数
        // 3、代码验证
        console.log(Math.random());
        // 4、我们想要得到两个数之间的随机整数 并且包含这2个整数
        function getNum(min ,max){
            return Math.floor(Math.random() * (max - min + 1)) + min;
        }
        console.log(getNum(1,10));

        // 5、随机点名
        var arr = ['张三','张三丰','张三疯子','李四','李思思'];
        console.log(arr[getNum(0,arr.length - 1)]);
        
    </script>
</head>
<body>
    
</body>
</html>

在这里插入图片描述

3.3.3、猜数字游戏

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        function getRandom(min,max){
            return Math.floor(Math.random() * (max - min + 1)) + min;
        }
        //获取随机数
        var random = getRandom(1,10);
        console.log(random);
        while(true){
            var num = prompt('你来猜？输入1~10之间的一个数字');
            if(num > random){
                alert('数字大了，继续猜');
            }else if(num < random){
                alert('数字小了，继续猜');
            }else {
                alert('恭喜您猜对了');
                break;//退出整个循环结结束程序
            }
        }
        
    </script>
</head>
<body>
    
</body>
</html>