一、Math常用的方法
Math:数学函数 “它是一个标准特殊对象” 因为Math对象中包含了很多操作“数字/几何/数学”的方法 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Math
1）Math.abs([value]) 求绝对值
Math.abs(-1)
2）Math.ceil/Math.floor 向上取整，向下取整
向上取整，无论是正数还是负数，都取最大的值
向下取整，无论是正数还是负数，都取最小的值
Math.ceil(1.2)
2
Math.ceil(-1.6)
-1
Math.floor(1.8)
1
Math.floor(-1.1)
-2
3)Math.round() 四舍五入
- 正数的话，还是正常的，之前理解的，但是如果是负数，临界点必须大于5
Math.round(1.5)
2
Math.round(-1.5)
-1
Math.round(-1.51)
-2
4）Math.sqrt() 开平方
Math.sqrt(9)
3
5)Math.pow(n,m) 取幂
n的m次幂
Math.pow(3,2) ==> 9
6)Math.PI
Math.PI ===>3.141592653589793
7)Math.max/Math.min 获取最大值和最小值
Math.max(1,2,3)
Math.min(4,5,6)
8)Math.random() 获取0~1 之间的随机数（大于等于0，小于1）
获取n 到m 之间的随机数：Math.random()*(m-n)+n;
// 获取10 到20 之间的随机数
Math.random()*(20-10)+10
1.Math.random是取[0,1)的数； 获取随机数[0,1] 0-1之间的小数 包含0 不包含1
2.探索：获取n到m之间的随机整数[n,m] 前提 n
获取0-10的随机整数
Math.round(Math.random()(10-1)+1)
二 验证码案例
1.四位可能重复 for循环
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
* {
margin: 0;
padding: 0;
}
.coedBox {
margin: 20px;
cursor: pointer;
width: 150px;
height: 50px;
line-height: 50px;
font-size: 30px;
color: #9d2121;
text-align: center;
background-color: lightcyan;
letter-spacing: 5px;
user-select: none;
/*不允许用户复制*/
}
</style>
</head>
<body>
<div class="coedBox">
YQa3
</div>
<!--
验证码 数字＋字母组合
拼图
数学运算
按顺序点击
选图片 旋转图片
-->
<script>
var box = document.querySelector(".coedBox");
/* 生成四位验证码，并且放入到codeBox黑盒子中 */
function createCode() {
//area 取值范围 所以0~61 获取某个字符area.charAt([索引])
var area = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
// 循环四次 每一次都创建一个0-61之间的随机索引 根据索引取出字符 拼接在一起 就是想要的验证码
var code = '';//存放拼接起来的结果
for (var i = 0; i < 4; i++) {
var ran = Math.round(Math.random() * (61 - 0) + 0),//Math.round(Math.random()*[m-n]+n)
char = area.charAt(ran);
code += char; //把字符拼接起来
}
//把生成的验证码放置在盒子中
box.innerHTML = code;
}
/* 加载页面的时候执行一次 */
createCode();
// 点击盒子重新执行方法
box.onclick = createCode;//不写小括号是吧方法给到点击事件
</script>
</body>
</html>
2.四位不重复 while循环 制作验证码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
* {
margin: 0;
padding: 0;
}
.coedBox {
margin: 20px;
cursor: pointer;
width: 150px;
height: 50px;
line-height: 50px;
font-size: 30px;
color: #9d2121;
text-align: center;
background-color: lightcyan;
letter-spacing: 5px;
user-select: none;
/*不允许用户复制*/
}
</style>
</head>
<body>
<div class="coedBox">
YQa3
</div>
<!--
验证码 数字＋字母组合
拼图
数学运算
按顺序点击
选图片 旋转图片
-->
<script>
/* ----不重复的验证码 每一次取出的字符 不一定要拼接进去 只有之前已经拼接好的验证码中，没有这个字符 我们才拼接
* +不确定循环的次数 只有当验证码已经拼成四位后，才会结束
*
*
*/
var box = document.querySelector(".coedBox");
/* 生成四位验证码，并且放入到codeBox黑盒子中 */
function createCode() {
//area 取值范围 所以0~61 获取某个字符area.charAt([索引])
var area = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
// 循环四次 每一次都创建一个0-61之间的随机索引 根据索引取出字符 拼接在一起 就是想要的验证码
var code = '';//存放拼接起来的结果
while(code.length<4){
var ran = Math.round(Math.random() * (61 - 0) + 0),//Math.round(Math.random()*[m-n]+n)
char = area.charAt(ran);
//验证当前获取的字符在已有的验证码中是否存在 如果存在就不累加了[忽略大小写]
if(code.toLowerCase().indexOf(char.toLowerCase())===-1){
code += char; //把字符拼接起来
}
}
//把生成的验证码放置在盒子中
box.innerHTML = code;
}
/* 加载页面的时候执行一次 */
createCode();
// 点击盒子重新执行方法
box.onclick = createCode;//不写小括号是吧方法给到点击事件
</script>
</body>
</html>
三 While循环
只要条件成立，就一直执行，知道条件不成立的时候停止 使用while 循环的时候，一定要避免死循环 知道循环的次数 我们一般使用for循环 不知道具体多少次的 一般使用while
while(条件){
循环体
}
四 日期对象
new Date();//获取当前客户端本地的日期，结果是一个日期对象 仅供参考 因为客户端时间可以肆意更改 不能拿它做重要的业务判断 new Date([时间字符串])： 把一个时间字符串 变为标准的日期对象
【1作用】：Date 对象用于处理日期和时间。
【2创建时间对象】： new Date（）
var myDate=new Date(); //Sun Apr 18 2021 01:03:46 GMT+0800 (中国标准时间) 2021/4/18
//Sun=》星期 Apr=》四月 18=》日 2021=》2021年 01:06:46
typeof myDate;====>"object" // 获取到是一个对象，并不是字符串
【3】时间对象相关属性和方法
- getDate（）；//获取日
- getDay（）；//获取星期几 （结果为 0—-6）代表周日到到周六 因为在外国默认第一天为周日
- getFullYear（）；//获取年
- getHours（）；//获取小时
- getMilliseconds()；//获取毫秒
- getMinutes();//获取分钟
- getMonth()://获取月 0到11 代表1月到12月
- getSeconds();//获取秒
- getTime();获取当前日期到1970年1月1号 00：00:00 之间的毫秒差
- toLocaleString();// 获取到的是年月日，时分秒”2019/12/25 上午10:15:50”
- toLocaleDateString();// 获取到是字符串的年月日，例如：”2019/12/25”
- toLocaleTimeString();/ 获取到的是字符串的时分秒上午10:18:28
【4】日期格式化方法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
//格式化时间字符串 把某个格式的时间字符串 变为我想要的格式
function zero(str){
//补充0
str=str+'';
return str.length<2?`0${str}`:str;
}
/* 时间字符串格式化 */
function formatTime(time){
//转成日期对象
time=new Date(time);
var year=time.getFullYear(),
month=time.getMonth()+1;//默认是0-11
day=time.getDate(),//当前日
week=time.getDay(),//0-6 周日到周六
hours=time.getHours(),//获取小时
minues=time.getMinutes(),//获取分钟
seconds=time.getSeconds();//获取秒
var weekstr="日一二三四五六";
week=`星期${weekstr.charAt(week)}`;
return `${year}年${zero(month)}月${zero(day)}日 ${week} ${zero(hours)}时${zero(minues)}分${zero(seconds)}秒`;
}
//console.log(time);
var res=formatTime('2021/4/17 12:36:8');
console.log(res);
</script>
</body>
</html>
若有收获，就点个赞吧
0 人点赞
