前端——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>
相关推荐
「、皓子~14 分钟前
后台管理系统的诞生 - 利用AI 1天完成整个后台管理系统的微服务后端+前端
前端·人工智能·微服务·小程序·go·ai编程·ai写作
就改了17 分钟前
Ajax——在OA系统提升性能的局部刷新
前端·javascript·ajax
凌冰_19 分钟前
Ajax 入门
前端·javascript·ajax
wt_cs26 分钟前
银行回单ocr api集成解析-图像文字识别-文字识别技术
开发语言·python
京东零售技术34 分钟前
京东小程序JS API仓颉改造实践
前端
奋飛43 分钟前
TypeScript系列:第六篇 - 编写高质量的TS类型
javascript·typescript·ts·declare·.d.ts
老A技术联盟43 分钟前
从小白入门,基于Cursor开发一个前端小程序之Cursor 编程实践与案例分析
前端·小程序
风铃喵游1 小时前
构建引擎: 打造小程序编译器
前端·小程序·架构
_WndProc1 小时前
【Python】Flask网页
开发语言·python·flask
sunbyte1 小时前
50天50个小项目 (Vue3 + Tailwindcss V4) ✨ | ThemeClock(主题时钟)
前端·javascript·css·vue.js·前端框架·tailwindcss