个人博客 个人博客
首页
  • 前端
  • 后端
  • Git
  • Docker
  • 网络
  • 操作系统
工具
阅读
收藏
  • 分类
  • 标签
  • 归档
GitHub (opens new window)

董先亮

前端react开发
首页
  • 前端
  • 后端
  • Git
  • Docker
  • 网络
  • 操作系统
工具
阅读
收藏
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
  • HTML

  • CSS

  • JavaScript

    • 防抖与节流
    • 本地存储
    • PWA
    • 地理位置
    • 对象 Object
    • 事件坐标详解
    • 常用函数
      • DOM相关
        • 获取元素距页面左侧、顶部距离
    • class类
    • Array 数组
    • 其他
    • blob下载文件
    • 深度克隆
    • 模块化
    • 常用工具函数
    • 拖拽
    • Map与Set
  • TypeScript

  • 前端基础
  • JavaScript
NeverStop1024
2022-08-27
目录

常用函数

# 随机数

Math.random()生成[0,1)随机数
如何得到1-100随机数呢
Math.random() 可以得到0-0.9999999999.....
Math.random() * 100 可以得到0-99.9999999999.....
Math.random()*100+1 可以得到1-100.9999999999.....
向下取整
Math.floor(Math.random()*100+1) 就可以得到1-100随机整数了

// 生成区间整数,如random(20,30)
const random = (min,max) => 
        Math.floor(Math.random() * (max-min+1) ) + min;
1
2
3

# 种子随机数

只要传入的种子唯一,每次调用方法得到的随机数也是唯一的。参考 (opens new window)

/**
 * 种子随机数
 * @desc 传入唯一种子,生成唯一随机数
 * @param seed {Number} 种子
 * @param min {Number} 随机数最小值
 * @param max {Number} 随机数最大值
 * @return {Number} 生成的随机数
 * @example seededRandom(12,500,1000)
 */
const seededRandom = (seed,min,max) => {
  min = min || 0;
  max = max || 1;

  seed = (seed * 9301 + 49297) % 233280;
  const rnd = seed / 233280.0;

  return Math.ceil( min + rnd * (max - min) );
};
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

# DOM相关

# 获取元素距页面左侧、顶部距离

   const getElementTop = (elem) => {
        let elemTop = elem.offsetTop;//获得elem元素距相对定位的父元素的top
        let elemLeft = elem.offsetLeft;//获得elem元素距相对定位的父元素的top

        let e =elem.offsetParent;//将elem换成起相对定位的父元素
        while(e!=null){//只要还有相对定位的父元素
            //获得父元素 距他父元素的top值,累加到结果中
            elemTop+=e.offsetTop;
            elemLeft += e.offsetLeft;
            //再次将elem换成他相对定位的父元素上;
            e=e.offsetParent;
        }
        return {pageLeft:elemLeft,pageTop:elemTop};
    }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
编辑 (opens new window)
#常用函数
上次更新: 2022/08/29
事件坐标详解
class类

← 事件坐标详解 class类→

最近更新
01
mock使用
07-12
02
websocket即时通讯
07-12
03
前端面试题
07-09
更多文章>
Theme by Vdoing | Copyright © 2022-2023 NeverStop1024 | MIT License
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式