【JavaScript】内置对象 ③ ( Math 内置对象 | Math 内置对象简介 | Math 内置对象的使用 )

文章目录

  • [一、Math 内置对象](#一、Math 内置对象)
    • [1、Math 内置对象简介](#1、Math 内置对象简介)
    • [2、Math 内置对象的使用](#2、Math 内置对象的使用)
  • 二、代码示例
    • [1、代码示例 - Math 内置对象的使用](#1、代码示例 - Math 内置对象的使用)
    • [2、代码示例 - 封装 Math 内置对象](#2、代码示例 - 封装 Math 内置对象)

一、Math 内置对象


1、Math 内置对象简介

JavaScript 中的 Math 内置对象 是一个 全局对象 , 该对象 提供了 常用的 数学常数 和 数学计算函数 ;

利用 Math 对象 的 函数和常数 , 可以完成各种数学运算任务 , 如 :

  • 获取最大 / 最小值
  • 求绝对值
  • 随机数生成
  • 三角函数计算
  • 对数计算
  • 取整

Math 文档地址 : https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Math

2、Math 内置对象的使用

Math 不是 构造函数 , 其所有的 属性 和 方法 都是静态的 , 不需要使用 new 操作符

JavaScript 引擎初始化完毕后 , 该 Math 内置对象就会被创建 , 可以直接调用 Math 对象 ;

在代码中 , 可以直接 通过调用

  • Math.属性名
javascript 复制代码
        // 打印 Math 内置对象的常量
        // 输出 : 3.141592653589793
        console.log(Math.PI)
  • math.方法名()
javascript 复制代码
        // 调用 Math 内置对象的方法
        // 输出 : 3
        console.log(Math.max(1, 2, 3))

的方式 , 调用该 Math 内置对象的 属性 和 方法 ;

二、代码示例


1、代码示例 - Math 内置对象的使用

完整代码示例 :

html 复制代码
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- 设置 meta 视口标签 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no,maximum-scale=1.0,minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>JavaScript</title>
    <style></style>
    <script>
        // 打印 Math 内置对象的常量
        // 输出 : 3.141592653589793
        console.log(Math.PI)

        // 调用 Math 内置对象的方法
        // 输出 : 3
        console.log(Math.max(1, 2, 3))
    </script>
</head>

<body>
</body>

</html>

执行结果 :

2、代码示例 - 封装 Math 内置对象

自己自定义一个对象 , 封装 一个 自定义数学计算对象 , 提供 圆周率 值 属性 , 和 求 最大值 的方法 ;

参考 【JavaScript】对象 ① ( 对象概念 | 对象使用场景 | 使用字面量创建对象 | 空对象字面量 | 小括号 / 中括号 / 大括号 作用 ) 博客 , 使用字面量创建对象 代码 ;

javascript 复制代码
var person = {  
    name: "Tom",  
    age: 18,  
    hello: function() {  
        return this.name+ " is " + this.age + " years old";  
    }  
};

完整代码示例 :

html 复制代码
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- 设置 meta 视口标签 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no,maximum-scale=1.0,minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>JavaScript</title>
    <style></style>
    <script>
        var math = {
            // 封装 圆周率 属性
            PI: Math.PI,

            // 封装 求最大值的方法
            max: function() {
                // 此处不知道输入多少个参数 , 使用 arguments 获取不同个数的实参
                var max = arguments[0]
                for (var i = 0; i < arguments.length; i++) {
                    if (arguments[i] > max) {
                        max = arguments[i]
                    }
                }
                return max
            }
        }

        // 调用自定义对象的属性
        console.log(math.PI)

        // 调用自定义对象的方法
        console.log(math.max(9, 5, 2, 7))
    </script>
</head>

<body>
</body>

</html>

执行结果 :

相关推荐
CSDN_RTKLIB3 小时前
C++取模与取余
开发语言·c++
wordbaby3 小时前
TanStack Router 实战:如何优雅地实现后台管理系统的“多页签” (TabList) 功能
前端·react.js
凌览3 小时前
2026年1月编程语言排行榜|C#拿下年度语言,Python稳居第一
前端·后端·程序员
星河耀银海3 小时前
C++开发入门——环境搭建与第一个程序
开发语言·c++·策略模式
user86158185781543 小时前
Element UI 表格 show-overflow-tooltip 长文本导致闪烁的根本原因与解法
前端
不会写前端的小丁3 小时前
前端首屏渲染性能优化小技巧
前端
还不秃顶的计科生3 小时前
defaultdict讲解
开发语言·javascript·ecmascript
晴虹3 小时前
lecen:一个更好的开源可视化系统搭建项目--组件和功能按钮的权限控制--全低代码|所见即所得|利用可视化设计器构建你的应用系统-做一
前端·后端·低代码
爱分享的鱼鱼3 小时前
Pinia 深度解析:现代Vue应用状态管理最佳实践
前端·后端
花归去3 小时前
echarts 柱状图包含右侧进度
开发语言·前端·javascript