.Math对象的使用
Math**对象**不是构造函数,它具有数字常数和函数的方法和属性。我们可以直接调用
Math - JavaScript | MDN (mozilla.org
成员 | 功能 |
---|---|
PL | 获取圆周率,结果为3.141592653589793 |
abs(x) | 获取x的绝对值,可传入普通数值或是用字符串表示的数值 |
max() | 获取所有参数中的最大值 |
min() | 获取所有参数中的最小值 |
pow(base,exponent) | 获取基数(base)的指数exponent)次幂,即 baseexponent |
sprt(x) | 获取x的平方根 |
ceil(x) | 获取大于或等于x的最小整数,即向上取整(舍弃小数部分,整数部分加 1) |
floor(x) | 获取小于或等于x的最大整数,即向下取整(舍弃小数部分,整数部分不 变) |
round(x) | 获取x的四舍五入后的整数值 |
random() | 获取大于或等于0.0且小于1.0的随机值 |
示例代码:
// 获取圆周率
Math.PI;
// 获取绝对值
Math.abs(-1);//1
Math.abs('-11');//11
// 获取最大值
Math.max(1, 2, 3, 4, 5);//5
// 获取最小值
Math.min(1, 2, 3, 4, 5);//1
// 获取基数(base)的指数(exponent)次幂
Math.pow(2, 4);// 获取2的4次幂 16
// 获取x的平方根
Math.sqrt(9);//3
// 向上取整
Math.ceil(1.9);//2
// 向下取整
生成指定范围的随机数 :
Math.random()用来获取随机数,每次调用该方法返回的结果都不同。
该方法返回的结果是一个很长的浮点数,其范围是0~1(不包括1)。
语法:
Math.random()
// 表示生成大于或等于min且小于max的随机值
Math.random() * (max - min) + min;
// 表示生成0到任意数之间的随机整数
Math.floor(Math.random() * (max + 1));
// 表示生成1到任意数之间的随机整数
Math.floor(Math.random() * max + 1);// 生成0-1之间的随机数
// [0,1)
var res = Math.random()
示例代码:
// 生成0-1之间的随机数
// [0,1)
var res = Math.random()
console.log(res);
// 生成大于或等于min且小于max的随机值
// [1-10)
var res1 = Math.random() * (10 - 1) + 1;
console.log(res1);
// 生成0到任意数之间的随机整数
// [0,10]
var res2 = Math.floor(Math.random() * (10 + 1));
console.log(res2);
// 生成1到任意数之间的随机整数
// [1,10]
var res3 = Math.floor(Math.random() * 10 + 1);
console.log(res3);
案例一:
要求:求10-20(包含10和20)之间的随机整数
// 分析公式
// 1. math.random() [0, 1) 0 <= x < 1
// 2. Math.random() * (max - min + 1) 公式 注意先计算乘数
// 3. 带入数据
// 4. Math.random() * (20 - 10 + 1)
// 5. Math.random() * (11)
// 6. [0, 1) * 11 ==> [0, 11)
// 7. [0, 11) + min ==> [0, 11) + 10 ==> [10, 21)
// 8. Math.floor([10, 21)); ==> 10, 20
// Math.floor(Math.random() * (max - min + 1) + min)
function getRandom(min, max) {
// Math.random()获取[0,1)
// Math.random() * (max - min + 1)+min表示获取[10,21)
// Math.floor([10,21))向下取整 [10,20]
return Math.floor(Math.random() * (max - min + 1) + min);
}
console.log(getRandom(10, 20))
案例2:
利用随机数,实现在数组中随机获取一个元素
function getRandom(min, max) {
// Math.floor向下取整
return Math.floor(Math.random() * (max - min + 1) + min);
}
console.log(getRandom(10, 20))
var arr = ['apple', 'banana', 'orange', 'pear']
// 通过getRandom函数获取随机数
console.log(arr[getRandom(0, arr.length - 1)])
案例3:
要求: 随机生成颜色RGB(0-255,0-255,0-255)
function getRandom(min, max) {
return Math.floor(Math.random() * (max - min + 1) + min);
}
function getRGB(min, max) {
var c1 = getRandom(min, max);
var c2 = getRandom(min, max);
var c3 = getRandom(min, max);
return 'rgb(' + c1 + ', ' + c2 + ', ' + c3 + ')';
}
console.log(getRGB(0, 255));
十六进制颜色:
function getRandom(min, max) {
return Math.floor(Math.random() * (max - min + 1) + min);
}
function getColor() {
var arr = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c',
'd', 'e', 'f'];
var str = '#';
for (var i = 0; i < 6; i++) {
str += arr[getRandom(0, 15)];
}
return str;
}
console.log(getColor());
案例:猜数字游戏
案例需求:使程序随机生成一个1~10之间的数字,并让用户输入一个数字,判断这两个数的大 小,如果用户输入的数字大于随机数,那么提示“你猜大了”,如果用户输入的数字小于随机数, 则提示“你猜小了”,如果两个数字相等,就提示“恭喜你,猜对了”,结束程序。
function getRandom(min, max) {
return Math.floor(Math.random() * (max - min + 1) + min);
}
var random = getRandom(1, 10);
while (true) { //死循环,利用break来跳出循环
var num = prompt('猜数字,范围在1~10之间。');
if (num > random) {
alert('你猜大了');
}
else if (num < random) {
alert('你猜小了')
}
else {
alert('恭喜你,猜对了');
break;
}
}
日期对象
日期对象的使用
用途:
JavaScript中的日期对象用来处理日期和时间。
注意:
JavaScript中的日期对象需要使用new Date()实例化对象才能使用,Date()是日期对象的构造函数
(和Math是有区别的)。
语法:
// 方式1:获取当前时间
var date1 = new Date();
console.log(date1)
// 输出:Wed Apr 05 2023 20:57:12 GMT+0800 (中国标准时间)
// 方式2:传入年、月、日、时、分、秒(月的范围是0~11,即真实月份-1)
var date2 = new Date(2023, 03, 06, 10, 57, 56);
console.log(date2)
// 输出:Thu Apr 06 2023 10:57:56 GMT+0800 (中国标准时间)
// 方式3:用字符串表示日期和时间
var date3 = new Date('2023-04-06 10:57:56');
console.log(date3)
// 输出:Thu Apr 06 2023 10:57:56 GMT+0800 (中国标准时间)
总结:
如果Date()不写参数,就返回当前时间
如果Date()里面写参数,就返回括号里面输入的时间
**日期对象的常用get方法(日期格式化)****
方法 | 作业 |
---|---|
getFullYear() | 获取表示年份的4位数字,如2020 |
getMonth() | 获取月份,范围0~11(0表示一月,1表示二月,依次类推) |
getDate() | 获取月份中的某一天,范围1~31 |
getDay() | 获取星期,范围0~6(0表示星期日,1表示星期一,依次类推) |
getHours() | 获取小时数,返回0~23 |
getMinutes() | 获取分钟数,范围0~59 |
getSeconds() | 获取秒数,范围0~59 |
getMilliseconds() | 获取毫秒数,范围0—999 |
getTime() | 获取从1970-01-01 00:00:00距离Date对象所代表时间的毫秒数 |
日期对象的常用set方法
方法 | 作用 |
---|---|
setFullYear(value) | 设置年份 |
setMonth(value) | 设置月份 |
setDate(value) | 设置月份中的某一天 |
setHours(value) | 设置小时数 |
setMinutes(value) | 设置分钟数 |
setSeconds(value) | 设置秒数 |
setMilliseconds(value) | 设置毫秒数 |
setTime(value) | 通过从1970-01-01 00:00:00计时的毫秒数来设置时间 |
案例:
2023年4月5日 星期三 请写出这个格式
function getMyDate() {
var arr = ['星期天', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
// 获取当前时间
var date = new Date();
console.log(date);
// 获取当前年份:date.getFullYear()
// 获取当前月份:date.getMonth() + 1——(0表示一月,1表示二月,依次类推)
// 获取当前月份中的某一天:date.getDate()
// 获取星期:arr[date.getDay()]——(0表示星期日,1表示星期一,依次类推)
var str = date.getFullYear() + '年' + (date.getMonth() + 1) + '月' +
date.getDate() + '日 ' + arr[date.getDay()];
return str;
}
console.log(getMyDate());
案例:统计代码执行时间
时间戳是获取从1970年1月1日0时0分0秒开始一直到当前UTC时间所经过的毫秒数。
为什么计算机起始时间从1970年开始[你似乎来到了没有知识存在的荒原 - 知乎
68386]
获取时间戳的常见方式如下:
// 方式1:通过日期对象的valueof()或getTime()方法
var date1 = new Date();
// valueOf用于获取对象的原始值
console.log(date1.valueOf()); // 示例结果:1571196996188
console.log(date1.getTime()); // 示例结果:1571196996188
// 方式2:使用“+”运算符转换为数值型
var date2 = + new Date();
console.log(date2); // 示例结果:1571196996190
// 方式3:使用HTML5新增的Date.now()方法
console.log(Date.now()); // 示例结果:1571196996190
案例:倒计时
写一个函数,格式化日期对象,HH:mm:ss 的形式 比如 00:10:45
function getTimer() {
// 获取当前时间
var date = new Date();
// var str = date.getHours() + ':' + date.getMinutes() + ':' +
date.getSeconds();
var h = date.getHours();
var m = date.getMinutes();
var s = date.getMinutes();
// 使用三元表达式格式化日期
h = h < 10 ? '0' + h : h
m = m < 10 ? '0' + m : m
s = s < 10 ? '0' + s : s
return h + ':' + m + ':' + s;
}
console.log(getTimer())
案例需求:在一些电商网站的活动页上会经常出现折扣商品的倒计时标记,显示离活动结束还剩X
天X小时X分X秒。
倒计时的核心算法是输入的时间减去现在的时间,得出的剩余时间就是要显示的倒计时时间,这
需要把时间都转化成时间戳(毫秒数)来进行计算,把得到的毫秒数转换为天数、小时、分数、
秒数。
计算公式:
d = parseInt(总秒数/ 60/60 /24); // 计算天数
h = parseInt(总秒数/ 60/60 %24) // 计算小时
m = parseInt(总秒数 /60 %60 ); // 计算分数
s = parseInt(总秒数%60); // 计算当前秒数
示例代码:
function getCountTime(endTime) {
var d, h, m, s;
//1. 用用户输入的时间 减去 开始的时间就是 倒计时
//2. 但是要注意,我们得到是 毫秒数 然后 把这个毫秒数转换为 相应的 天数 时分秒 就好了
//除以1000以后是在秒级进行操作(数字小利于计算),不除以1000则是在毫秒级进行操作
var countTime = parseInt((new Date(endTime) - new Date()) / 1000)
// console.log(countTime);
// 3. 把得到的毫秒数 转换 当前的天数 时分秒
console.log(countTime);
d = parseInt(countTime / 60 / 60 / 24); // 计算天数
h = parseInt(countTime / 60 / 60 % 24); // 计算小时
m = parseInt(countTime / 60 % 60); // 计算分数
s = parseInt(countTime % 60); // 计算当前秒数
return '还剩下' + d + '天' + h + '时' + m + '分' + s + '秒 ';
}
console.log(getCountTime('2023-05-01 00:00'));
数组元素排序或者颠倒数组元素的顺序等。
排序方法如下:
示例代码:
reverse
console.log(arr.push('red'));// 返回的是数组长度 输出结果为:5
console.log(arr);// 修改了原来的数组 输出结果为['pink', 'black', 'white', 'yellow',
'red']
// unshift
var arr = ['pink', 'black', 'white', 'yellow']
console.log(arr.unshift('red', 'blue'));// 返回的是数组长度 输出结果为:6
console.log(arr);// 修改了原来的数组 输出结果为['red', 'blue', 'pink', 'black',
'white', 'yellow']
// pop
var arr = ['pink', 'black', 'white', 'yellow']
console.log(arr.pop());// 返回的是删除的元素 输出结果为:yellow
console.log(arr);// 修改了原来的数组 输出结果为['pink', 'black', 'white']
// shift
var arr = ['pink', 'black', 'white', 'yellow']
console.log(arr.shift());// 返回的是删除的元素(第一个) 输出结果为:pink
console.log(arr);// 修改了原来的数组 输出结果为['pink', 'black', 'white']
注意:push()和unshift()方法的返回值是新数组的长度,而pop()和shift()方法返回的是移出的数组元素。
案例:筛选数组**
案例需求:**要求在包含工资的数组中,剔除工资达到2000或以上的数据,把小于2000的数重新放到新的数组里面
var arr = [1500, 1200, 2000, 2100, 1800];
var newArr = [];
for (var i = 0; i < arr.length; i++) {
if (arr[i] < 2000) {
newArr.push(arr[i]);// 相当于:newArr[newArr.length] = arr[i];
}
}
console.log(newArr);