JavaScript内置对象-Math对象

JavaScript内置对象-Math对象

  • 1、内置对象
  • 2、查文档
    • 2.1、MDN
    • 2.2、如何学习对象中的方法
  • 3、Math内置对象
    • 3.1、求最大值
    • 3.2、封装自己的数学对象
    • 3.3、Math概述
      • 3.3.1、Math绝对值和三个取整方法
      • 3.3.2、Math.Random()随机数方法、随机点名
      • 3.3.3、猜数字游戏

1、内置对象

JavaScript内置对象-Math对象_第1张图片

2、查文档

2.1、MDN

JavaScript内置对象-Math对象_第2张图片

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

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

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

JavaScript内置对象-Math对象_第3张图片

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>

JavaScript内置对象-Math对象_第4张图片

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概述

JavaScript内置对象-Math对象_第5张图片

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>

JavaScript内置对象-Math对象_第6张图片

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>

JavaScript内置对象-Math对象_第7张图片

3.3.3、猜数字游戏

JavaScript内置对象-Math对象_第8张图片

<!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>

你可能感兴趣的:(JavaScript,前端,javascript)