凡是涉及动画开发、高级编程、算法研究等,都跟数学有极大的联系。以前我们可能总埋怨数学没用,慢慢你会发现数学在编程中的重要性是非常大的。
有一句话说得很有意思:“买菜可能用不了什么高深数学,但是你的数学水平可能决定你在哪里买菜。” 开个玩笑,咱们还是回到正题。在入门阶段,我们只是学一下基本语法就可以,至于怎么做出各种特效,还得去学习更高级的技术。
在 JavaScript 中,我们可以使用 Math 对象的属性和方法来实现各种运算。Math 对象为我们提供了大量 “内置” 的数学常量和数学函数,极大地满足了实际开发需求。
Math 对象跟其他对象不一样,我们不需要使用 new 关键字来创造,而是直接使用它的属性和方法就行。
语法:
Math.属性
Math.方法()Math 对象的属性(常数)
在 JavaScript 中,Math 对象提供了一些常用的数学常数作为其属性。这些属性的值是固定的,我们不能对其进行修改。其中,常用的属性如下表所示。
| 属性 | 说明 |
|---|---|
| Math.PI | 圆周率(约 3.14159) |
| Math.E | 自然对数的底数(约 2.718) |
| Math.LN2 | 2 的自然对数(约 0.693) |
| Math.LN10 | 10 的自然对数(约 2.302) |
| Math.LOG2E | 以 2 为底 E 的对数(约 1.442) |
| Math.LOG10E | 以 10 为底 E 的对数(约 0.434) |
| Math.SQRT1_2 | 1/2 的平方根(约 0.707) |
| Math.SQRT2 | 2 的平方根(约 1.414) |
示例 1:访问 Math 对象的常数
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
const pi = Math.PI;
const e = Math.E;
const sqrt2 = Math.SQRT2;
console.log("圆周率 PI:" + pi);
console.log("自然对数的底数 E:" + e);
console.log("2 的平方根:" + sqrt2);
</script>
</body>
</html>运行结果如下。
圆周率 PI:3.141592653589793
自然对数的底数 E:2.718281828459045
2 的平方根:1.4142135623730951分析:
通过 Math.PI、Math.E 和 Math.SQRT2,我们可以直接获取这些数学常数的值。
Math 对象的方法
Math 对象提供了丰富的数学方法,用于执行各种计算,常用的如下表所示。
| 取整 | |
| Math.round(x) | 将数字四舍五入到最接近的整数 |
| Math.floor(x) | 向下取整,返回小于或等于 x 的最大整数 |
| Math.ceil(x) | 向上取整,返回大于或等于 x 的最小整数 |
| Math.trunc(x) | 截断小数部分,返回数字的整数部分(ES6+) |
| 绝对值 | |
| Math.abs(x) | 返回数字的绝对值 |
| 最值 | |
| Math.max(x1, x2, ...) | 返回一组数字中的最大值 |
| Math.min(x1, x2, ...) | 返回一组数字中的最小值 |
| 幂和平方根 | |
| Math.pow(base, exponent) | 返回 base 的 exponent 次幂 |
| Math.sqrt(x) | 返回数字的平方根 |
| 随机数 | |
| Math.random() | 返回一个介于 0(包含)和 1(不包含)之间的伪随机浮点数 |
| 三角函数 | |
| Math.sin(x) | 正弦 |
| Math.cos(x) | 余弦 |
| Math.tan(x) | 正切 |
| Math.asin(x) | 反正弦 |
| Math.acos(x) | 反余弦 |
| Math.atan(x) | 反正切 |
| Math.atan2(y, x) | 反正切(注意 y、x 顺序) |
示例 2:Math 对象的取整方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
const num = 3.7;
const result1 = Math.round(num);
const result2 = Math.floor(num);
const result3 = Math.ceil(num);
const result4 = Math.trunc(num);
console.log(num + " 四舍五入为:" + result1);
console.log(num + " 向下取整为:" + result2);
console.log(num + " 向上取整为:" + result3);
console.log(num + " 截断小数部分为:" + result4);
</script>
</body>
</html>运行结果如下。
3.7 四舍五入为:4
3.7 向下取整为:3
3.7 向上取整为:4
3.7 截断小数部分为:3示例 3:Math 对象求绝对值
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
const num = -3.14;
const result = Math.abs(num);
console.log(num + " 的绝对值是:" + result);
</script>
</body>
</html>运行结果如下。
-3.14 的绝对值是:3.14示例 4:Math 对象求最大值和最小值
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
const maxNumber = Math.max(10, 5, 20, 8, 12);
const minNumber = Math.min(10, 5, 20, 8, 12);
console.log("最大值是:" + maxNumber);
console.log("最小值是:" + minNumber);
</script>
</body>
</html>运行结果如下。
最大值是:20
最小值是:5示例 5:Math 对象求幂和平方根
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
const result1 = Math.pow(2, 3); // 2 的 3 次幂
const result2 = Math.sqrt(16); // 16 的平方根
console.log("2 的 3 次幂是:" + result1);
console.log("16 的平方根是:" + result2);
</script>
</body>
</html>运行结果如下。
2 的 3 次幂是:8
16 的平方根是:4