前端——js补充
一、数学对象
1.随机数
// 0-1
console.log(Math.random());
// 0-9
console.log(Math.random() * 9);
// 6-13
console.log(Math.random() * (13 - 6) + 6);
//n-m
Math.random() * (m - n) + n
2.取整
// 向下取整
console.log(Math.floor(1.9));//1
// 向上取整
console.log(Math.ceil(1.1));//2
// 四舍五入
console.log(Math.round(1.49)); // 1
3.其他
console.log( (2.12312412).toFixed(2) );//2.12
console.log(Math.abs(-888));//888
console.log(Math);
二、定时器对象
1.定时炸弹
let d;
document.querySelector('#k').onclick = () => {
console.log("死歌开大！");
// 设为定时器
d = setTimeout(() => {
console.log("敌方全部，上路。");
}, 3000);
}
document.querySelector('#z').onclick = () => {
console.log("死歌被干掉，大招未成功。");
// 清除定时器
clearTimeout(d)
}
2.定时任务
let b
document.querySelector('#k').onclick = () => {
console.log('天气冷了。');
let i = 0;
// 设置定时任务
b = setInterval(() => {
console.log("妈妈：天气这么冷了，你咋还不穿秋裤？", i++);
}, 2000)
}
document.querySelector('#z').onclick = () => {
// 清除定时任务
clearInterval(b)
console.log("行行行，我穿还不行嘛。");
}
三、日期对象
1.当前时间
console.log(new Date());
2.特定时间
console.log(new Date('2024-06-26 20:00:00'));
console.log(new Date('2024-07-27 20:00:00'));
let d = new Date('2024-07-27 20:01:54');
console.log(d.getFullYear()); // 年
console.log(d.getMonth() + 1); // 月
console.log(d.getDate()); // 日
console.log(d.getHours()); // 时
console.log(d.getMinutes()); // 分
console.log(d.getSeconds()); // 秒
3.特殊时间
console.log(d.getTime()); // 时间戳 单位毫秒
console.log(d.getDay());
四、存储对象
1.临时存储
// 增加数据 // 修改数据
sessionStorage.setItem("宇智波厚度", "吊打一打七")
sessionStorage.setItem("宇智波厚度", "吊打一打七 + 干柿鬼鲛")
// 查数据
console.log(
sessionStorage.getItem("宇智波厚度")
);
// 删除数据
sessionStorage.removeItem("宇智波厚度")
// 清空
sessionStorage.clear()
2.永久存储
// 增加数据 // 修改数据
localStorage.setItem("宇智波厚度", "吊打一打七")
localStorage.setItem("宇智波厚度", "吊打一打七 + 干柿鬼鲛")
// 查数据
console.log(
localStorage.getItem("宇智波厚度")
);
// 删除数据
localStorage.removeItem("宇智波厚度")
// 清空
localStorage.clear()
五、同步和异步
1.同步
let time = 0;
// 吃早餐 10 、上课 100 、打游戏 20、聊天 20
console.log(` 吃早餐 10 `, time += 10);
console.log(` 上课 100 `, time += 100);
console.log(` 打游戏 20 `, time += 20);
console.log(` 聊天 20 `, time += 20);
console.log(time);
console.log(` 上课 100 吃早餐 10 打游戏 20 聊天 20`, time += 100);
2.异步
console.log(1);
// 异步代码
setTimeout(() => {
console.log(2);
}, 2000)
console.log(3);
六、promise对象
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><script>new Promise((正常反馈, 异常反馈) => {// // 异步代码setTimeout(() => {console.log('我是异步代码');正常反馈('我是异步代码12312');}, 2000)}).then((e)=>{console.log(e);}).catch(e=>{console.log(e);})function name() {return new Promise((resolve, reject) => {setTimeout(() => {reject('xxx')resolve('1宇智波厚度');// console.log('1宇智波厚度');}, 2000)})}// 使用async 和 await 可以实现在函数内无异步(async ()=>{try{console.log(await name());}catch(e){console.error(e);}console.log("2我就是宇智波厚渡！");})()// name().then((result) => {// console.log(result);// })// console.log("2我就是宇智波厚渡！");</script></body></html>