JS工具类常用方法

关注

原创 2025-07-02 15:34:45 485 阅读 AI 写同款· GEO 优化 ›

别再死磕Excel了！用Vensim PLE免费版，30分钟搞定你的第一个系统动力学模型本文介绍如何使用Vensim PLE免费版在30分钟内构建第一个系统动力学模型，无需编程或数学基础。通过个人储蓄增长案例，详细讲解因果回路图绘制、存量流量图创建及方程编写，帮助读者掌握动态系统建模与仿真技巧，适用于理财、项目管理等多种场景。阅读详情

JS工具类常用方法

	/**
	 * 绘制圆角矩形
	 * @param {Object} ctx - canvas组件的绘图上下文
	 * @param {Number} x - 矩形的x坐标
	 * @param {Number} y - 矩形的y坐标
	 * @param {Number} w - 矩形的宽度
	 * @param {Number} h - 矩形的高度
	 * @param {Number} r - 矩形的圆角半径
	 * @param {String} [c = 'transparent'] - 矩形的填充色
	 */
	export function roundRect(ctx, x, y, w, h, r, c = '#fff') {
		if (w < 2 * r) r = w / 2;
		if (h < 2 * r) r = h / 2;
		ctx.beginPath();
		ctx.fillStyle = c;
		ctx.arc(x + r, y + r, r, Math.PI, Math.PI * 1.5);
		ctx.moveTo(x + r, y);
		ctx.lineTo(x + w - r, y);
		ctx.lineTo(x + w, y + r);
		ctx.arc(x + w - r, y + r, r, Math.PI * 1.5, Math.PI * 2);
		ctx.lineTo(x + w, y + h - r);
		ctx.lineTo(x + w - r, y + h);
		ctx.arc(x + w - r, y + h - r, r, 0, Math.PI * 0.5);
		ctx.lineTo(x + r, y + h);
		ctx.lineTo(x, y + h - r);
		ctx.arc(x + r, y + h - r, r, Math.PI * 0.5, Math.PI);
		ctx.lineTo(x, y + r);
		ctx.lineTo(x + r, y);
		ctx.fill();
		ctx.closePath();
	}

	/**
	 * 绘制上左上右两个圆角图片
	 * @param {Object} ctx - canvas组件的绘图上下文
	 * @param {String} img - 图片
	 * @param {Number} x - 图片的x坐标
	 * @param {Number} y - 图片的y坐标
	 * @param {Number} width - 图片的宽度
	 * @param {Number} height - 图片的高度
	 * @param {Number} r - 图片的圆角半径
	 */
	export function imgfillet(ctx, img, x, y, width, height, r) {
		if (width < 2 * r) r = width / 2;
		if (height < 2 * r) r = height / 2;
		ctx.beginPath();
		ctx.save();
		ctx.setLineWidth(1);
		ctx.setStrokeStyle('#ffffff');
		ctx.moveTo(x + r, y); // 创建开始点
		ctx.lineTo(x + width - r, y); // 创建水平线
		ctx.arcTo(x + width, y, x + width, y + r, r); // 右上角创建弧 
		ctx.lineTo(x + width, y + height); // 创建垂直线
		ctx.lineTo(x + r, y + height); // 创建水平线
		ctx.lineTo(x, y + height); // 创建垂直线
		ctx.arcTo(x, y, x + r, y, r); // 左上角创建弧
		ctx.stroke(); // 画出当前路径的边框
		ctx.clip(); //剪切
		ctx.drawImage(img, x, y, width, height);
		ctx.restore();
		ctx.closePath();
	}

	/**
	 * 绘制四个圆角图片
	 * @param {Object} ctx - canvas组件的绘图上下文
	 * @param {String} img - 图片
	 * @param {Number} x - 图片的x坐标
	 * @param {Number} y - 图片的y坐标
	 * @param {Number} width - 图片的宽度
	 * @param {Number} height - 图片的高度
	 * @param {Number} r - 图片的圆角半径
	 */
	export function imageRound(ctx, img, x, y, width, height, r) {
		if (width < 2 * r) r = width / 2;
		if (height < 2 * r) r = height / 2;
		ctx.beginPath();
		ctx.save();
		ctx.setLineWidth(1);
		ctx.setStrokeStyle('#ffffff');
		ctx.moveTo(x + r, y); // 创建开始点
		ctx.lineTo(x + width - r, y); // 创建水平线
		ctx.arcTo(x + width, y, x + width, y + r, r); // 右上角创建弧 
		ctx.lineTo(x + width, y + height - r); // 创建垂直线
		ctx.arcTo(x + width, y + height, x + width - r, y + height, r); // 右下角创建弧
		ctx.lineTo(x + r, y + height); // 创建水平线
		ctx.arcTo(x, y + height, x, y + height - r, r); // 左下角创建弧
		ctx.lineTo(x, y + r); // 创建垂直线
		ctx.arcTo(x, y, x + r, y, r); // 左上角创建弧
		ctx.stroke(); // 画出当前路径的边框
		ctx.clip(); //剪切
		ctx.drawImage(img, x, y, width, height);
		ctx.restore();
		ctx.closePath();
	}

	/**
	 * 字符串中间几位修改为*号
	 * @param {String} str - 操作字符串
	 * @param {Number} start - 开头不需要变成星号的长度
	 * @param {Number} end - 末尾不需要变成星号的长度，设置默认值为0, 不传就除了设置的开头几位剩余全部变成星号
	 */
	export function changeToStar(str, start, end = 0) {
		let strLen = str.length;
		let stars = ''
		for (let i = 0; i < strLen - start - end; i++) {
			stars += '*'
		}
		str = str.substr(0, start) + stars + str.substr(strLen - end);
		return str;
	}

	/**
	 * 获取当前日期N天后的日期
	 * @param {Number} AddDayCount - 天数
	 */
	export function getDateStr(AddDayCount) {
		var dd = new Date();
		dd.setDate(dd.getDate() + AddDayCount); //获取AddDayCount天后的日期
		var y = dd.getFullYear();
		var m = (dd.getMonth() + 1) < 10 ? "0" + (dd.getMonth() + 1) : (dd.getMonth() + 1); //获取当前月份的日期，不足10补0
		var d = dd.getDate() < 10 ? "0" + dd.getDate() : dd.getDate(); //获取当前几号，不足10补0
		return y + "-" + m + "-" + d;
	}

	/**
	 * 获取当前日期的N天前后的日期数组  日期格式2020-07-23
	 * @param {Number} num - 天数
	 */
	export function getAllDate(num) {
		var today = new Date();
		var dateArr = [];
		for (var i = 1; i < num; i++) {
			var newDate = new Date(today.getTime() - i * 1000 * 60 * 60 * 24); // N天前
			var year = newDate.getFullYear();
			var month = (parseInt(newDate.getMonth()) + 1) > 9 ? (parseInt(newDate.getMonth()) + 1) : "0" + (parseInt(
				newDate.getMonth()) + 1);
			var day = (newDate.getDate()) > 9 ? newDate.getDate() : "0" + newDate.getDate();
			var fullDate = `${year}-${month}-${day}`;
			dateArr.unshift(fullDate);
		}
		for (var i = 0; i < num; i++) {
			var newDate = new Date(today.getTime() + i * 1000 * 60 * 60 * 24); // N天后
			var year = newDate.getFullYear();
			var month = (parseInt(newDate.getMonth()) + 1) > 9 ? (parseInt(newDate.getMonth()) + 1) : "0" + (parseInt(
				newDate.getMonth()) + 1);
			var day = (newDate.getDate()) > 9 ? newDate.getDate() : "0" + newDate.getDate();
			var fullDate = `${year}-${month}-${day}`;
			dateArr.push(fullDate);
		}
		return dateArr;
	}

	/**
	 * 获取当期日期是星期几  日期格式2020-07-23
	 * @param {String} datestr - 日期
	 */
	export function getDateIsweek(datestr) {
		var weekArray = new Array("周日", "周一", "周二", "周三", "周四", "周五", "周六");
		var week = weekArray[new Date(datestr).getDay()];
		return week;
	}

	/**
	 * 格式化时间戳为日期
	 * @param {*} date 传入一个时间
	 * @param {*} fmt 时间格式
	 * @param {*} defaultValue 默认值
	 * @return 日期字符串
	 */
	export function dateFormat(date, fmt = "yyyy-MM-dd HH:mm:ss", defaultValue = "") {
	    if (!date) {
	        return defaultValue;
	    }
	    if (typeof date === "string") {
	        date = new Date(date.replace(/-/g, "/"));
	    } else {
	        date = new Date(date);
	    }
	    var o = {
	        "M+": date.getMonth() + 1, //月份
	        "d+": date.getDate(), //日
	        "H+": date.getHours(), //小时
	        "m+": date.getMinutes(), //分
	        "s+": date.getSeconds(), //秒
	        "q+": Math.floor((date.getMonth() + 3) / 3), //季度
	        S: date.getMilliseconds() //毫秒
	    };
	    if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
	    for (var k in o)
	        if (new RegExp("(" + k + ")").test(fmt))
	            fmt = fmt.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length));
	    return fmt;
	}

	/**
	 * 格式化时间戳为字符串日期
	 * @param {(Object|string|number)} time
	 * @param {string} cFormat
	 * @return {string | null}
	 */
	export function parseTime(time, cFormat) {
	    if (arguments.length === 0 || !time) {
	        return null
	    }
	    const format = cFormat || '{y}-{m}-{d} {h}:{i}:{s}'
	    let date
	    if (typeof time === 'object') {
	        date = time
	    } else {
	        if ((typeof time === 'string')) {
	            if ((/^[0-9]+$/.test(time))) {
	                // support "1548221490638"
	                time = parseInt(time)
	            } else {
	                time = time.replace(new RegExp(/-/gm), '/')
	            }
	        }
	        if ((typeof time === 'number') && (time.toString().length === 10)) {
	            time = time * 1000
	        }
	        date = new Date(time)
	    }
	    const formatObj = {
	        y: date.getFullYear(),
	        m: date.getMonth() + 1,
	        d: date.getDate(),
	        h: date.getHours(),
	        i: date.getMinutes(),
	        s: date.getSeconds(),
	        a: date.getDay()
	    }
	    const time_str = format.replace(/{([ymdhisa])+}/g, (result, key) => {
	        const value = formatObj[key]
	        // Note: getDay() returns 0 on Sunday
	        if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value] }
	        return value.toString().padStart(2, '0')
	    })
	    return time_str
	}

	/**
	 * 深拷贝对象
	 * @param {Object} obj 需要拷贝的对象
	 * @return 拷贝对象
	 */
	export function deepClone(obj) {
	    const _toString = Object.prototype.toString
	    // null, undefined, non-object, function
	    if (!obj || typeof obj !== 'object') {
	        return obj
	    }
	    // DOM Node
	    if (obj.nodeType && 'cloneNode' in obj) {
	        return obj.cloneNode(true)
	    }
	    // Date
	    if (_toString.call(obj) === '[object Date]') {
	        return new Date(obj.getTime())
	    }
	    // RegExp
	    if (_toString.call(obj) === '[object RegExp]') {
	        const flags = []
	        if (obj.global) { flags.push('g') }
	        if (obj.multiline) { flags.push('m') }
	        if (obj.ignoreCase) { flags.push('i') }
	        return new RegExp(obj.source, flags.join(''))
	    }
	    const result = Array.isArray(obj) ? [] : obj.constructor ? new obj.constructor() : { }
	    for (const key in obj) {
	        result[key] = deepClone(obj[key])
	    }
	    return result
	}

	/**
	 * 提取地址栏参数
	 * @param {string} name 需要获取的参数名
	 * @param {string} src 获取的url地址
	 * @return 参数值 {string}
	 */
	export function	getUrlArgument(name, src) {
		return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)')
			.exec(src) || [, ''])[1]
			.replace(/\+/g, '%20')) || null
	}

	/**处理小程序海报网络图片，base64图片 **/
	const fsm = wx.getFileSystemManager();
	const FILE_BASE_NAME = 'file_base64src'; //自定义文件名
	
	/**
	 * 删除本地同名文件
	 * @params {string} 删除文件后缀名
	 **/
	export function removeSave(format = 'png') {
		return new Promise((resolve) => {
			const filePath = `${wx.env.USER_DATA_PATH}/${FILE_BASE_NAME}.${format}`;
			fsm.unlink({
				filePath: filePath,
				success(res) {
					console.log('文件删除成功');
					resolve(true);
				},
				fail(e) {
					console.log('readdir文件删除失败：', e);
					resolve(true);
				}
			});
		})
	}

	/**
	 * 将base64图片，存储到本地，生成临时url
	 * @params {string} base64
	 * @return {string} 临时url
	 **/
	export function base64ToSave(base64data) {
		return new Promise((resolve) => {
			const [, format] = /data:image\/(\w+);base64,/.exec(base64data) || [];
			const bodyData = base64data.replace(/^data:image\/\w+;base64,/, "");
			if (!format) {
				return (new Error('ERROR_BASE64SRC_PARSE'));
			}
			const filePath = `${wx.env.USER_DATA_PATH}/${FILE_BASE_NAME}.${format}`;
			const buffer = wx.base64ToArrayBuffer(bodyData);
			fsm.writeFile({
				filePath,
				data: buffer,
				encoding: 'binary',
				success() {
					resolve(filePath);
				},
				fail() {
					return (new Error('ERROR_BASE64SRC_WRITE'));
				},
			});
		})
	}

  /**下载后台返回的文件流 **/
	let link = document.createElement('a');
	let filename = res.headers['content-disposition'].split('=')[1]; //文件名
	filename = decodeURI(filename);  //将文件名转码成中文
	let blob = new Blob([res.data], {type: res.headers['content-type']});  //将文件流转换成blob对象
	link.style.display = 'none';
	link.href = URL.createObjectURL(blob); //文件地址
	link.download = filename; 
	document.body.appendChild(link);
	link.click();
	document.body.removeChild(link);

	/** 操作普通数组 **/
	let arr = [1, 2]
    let num = [{name: '1', id:1}, {name: '2', id: 2}, {name: '4', id: 4}]
    let array = num.filter(val => arr.indexOf(val['id']) > -1)
    console.log(array)   // [{name: '1', id:1}, {name: '2', id: 2}]
	let arr = [1, 2, 3, 4]
    let array = [3, 4, 5, 6] 
    
    // 交集
    let jiao = arr.filter(item => array.indexOf(item) > -1)
    console.log(jiao) //[1, 2]
    
    // 并集
    let bing = arr.concat(array.filter(item => !(arr.indexOf(item) > -1)))
    console.log(bing) // [1, 2, 3, 4, 5, 6]
    
    // 补集 两个数组都没有的
    let bu = arr.filter(item => !(array.indexOf(item) > -1)).concat(array.filter(item => !(arr.indexOf(item) > -1)))
    console.log(bu) // [1, 2, 5, 6]
    
    // 差集
    let chaArr = arr.filter(item => array.indexOf(item) === -1)  //arr与array的差集
    console.log(chaArr) //[1, 2]
    let chaArray = array.filter(item => arr.indexOf(item) === -1) //array与arr的差集
    console.log(chaArray) // [5, 6]
    
    // ES6 Set 对象方法
    // add	添加某个值，返回Set对象本身。
   	// clear	删除所有的键/值对，没有返回值。
    // delete	删除某个键，返回true。如果删除失败，返回false。
    // forEach	对每个元素执行指定操作。
    // has	返回一个布尔值，表示某个键是否在当前 Set 对象之中。
    
    let setArr = [1,2,3,3,1,4];
    [...new Set(setArr)];  // [1, 2, 3, 4]
    Array.from(new Set(setArr));  // [1, 2, 3, 4]
    [...new Set('ababbc')].join('');  // "abc" 字符串去重
    let arr = [1, 2, 3, 4]
    let array = [3, 4, 5, 6]
    
    // 交集
    let jiao = arr.filter(item => new Set(array).has(item))
    console.log(jiao); // [3, 4]
    
    // 并集
    let bing = Array.from(new Set([...arr, ...array]))
    console.log(bing)  // [1, 2, 3, 4, 5, 6]
    
    // 补集 两个数组都没有的
    let bu = [...arr.filter(item => !(new Set(array).has(item))), ...array.filter(item => !(new Set(arr).has(item)))]
    console.log(bu) // [1, 2, 5, 6]
    
    // 差集
    let chaArr = arr.filter(item => !(new Set(array).has(item)))  //arr与array的差集
    let chaArray = array.filter(item => !(new Set(arr).has(item)))  //array与arr的差集
    console.log(chaArr); // [1, 2]
    console.log(chaArray) // [5, 6]
    
	/** 操作对象数组 **/
	let arr = [
      {id:1, name: "产品1", code: 'c001' },
      {id:2, name: "产品2", code: 'c002' },
      {id:3, name: "产品3", code: 'c003' },
    ]
    let array = [
      {id:3, name: "产品3", code: 'c003' },
      {id:4, name: "产品4", code: 'c004' },
      {id:5, name: "产品5", code: 'c005' },
    ]
    
    // 交集
    let jiao = [];
    for(let i = 0,len = arr.length; i< len; i++) {
      for(let j = 0, length = array.length; j < length; j++) {
        if(arr[i].id === array[j].id) {
          jiao.push(arr[i]);
        }
      }
    }
    console.log(jiao)   // [{id: 3, name: '产品3', code: 'c003'}]
    
    // 并集
    let bing = [...arr, ...array] 
    for(let i = 0,len = arr.length; i< len; i++) {
      for(let j = 0, length = array.length; j < length; j++) {
        if(arr[i].id === array[j].id) {
          bing.splice(bing.findIndex(item => item.id === arr[i].id), 1)
        }
      }
    }
    // [{id: 1, name: '产品1', code: 'c001'},{id: 2, name: '产品2', code: 'c002'},{id: 3, name: '产品3', code: 'c003'},{id: 4, name: '产品4', code: 'c004'},{id: 5, name: '产品5', code: 'c005'}]
    console.log(bing)
    
    // 补集 两个数组都没有的
    let bu = [...arr, ...array]
    for(let i = 0,len = arr.length; i< len; i++) {
      for(let j = 0, length = array.length; j < length; j++) {
        if(arr[i].id === array[j].id) {
          bu.splice(bu.findIndex(item => item.id === arr[i].id), 1)
          bu.splice(bu.findIndex(item => item.id === array[j].id), 1)
        }
      }
    }
    // [{id: 1, name: '产品1', code: 'c001'},{id: 2, name: '产品2', code: 'c002'},{id: 4, name: '产品4', code: 'c004'},{id: 5, name: '产品5', code: 'c005'}]
    console.log(bu)
    
    // 差集
    let chaArr = [...arr]
    for(let i = 0 , len = arr.length; i < len; i++) {
      let flag = false;
      for(let j = 0, length = array.length; j < length; j++) {
        if(arr[i].id === array[j].id) {
          flag = true;
        }
      }
      if(flag) {
        chaArr.splice(chaArr.findIndex(item => item.id === arr[i].id), 1)
      }
    }
    console.log(chaArr) //arr与array的差集 [{id: 1, name: '产品1', code: 'c001'},{id: 2, name: '产品2', code: 'c002'}]
    let chaArray = [...array]
    for(let i = 0 , len = arr.length; i < len; i++) {
      let flag = false;
      for(let j = 0, length = array.length; j < length; j++) {
        if(arr[i].id === array[j].id) {
          flag = true;
        }
      }
      if(flag) {
        chaArray.splice(chaArray.findIndex(item => item.id === arr[i].id), 1)
      }
    }
    console.log(chaArray) //array与arr的差集 [{id: 4, name: '产品4', code: 'c004'},{id: 5, name: '产品5', code: 'c005'}]

   // 获取完整地址栏参数
   export const getUrlParams = (url: string, name: string) => {
     const reg = new RegExp('(^|&|/?)' + name + '=([^&|/?]*)(&|/?|$)', 'i')
     const r = url.substring(1).match(reg)
     if (r) return decodeURI(r[2])
     return ''
   }

	// 获取?号后的参数（location.search）
	export const getQueryParams = (url: string, name: string) => {
	  const reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i')
	  const r = url.substring(1).match(reg)
	  if (r != null) return decodeURI(r[2])
	  return null
	}

	// 将一个16进制转10进制数字
	export const hex2int = (hex: any) => {
	  var len = hex.length,
	    a = new Array(len),
	    code;
	  for (var i = 0; i < len; i++) {
	    code = hex.charCodeAt(i);
	    if (48 <= code && code < 58) {
	      code -= 48;
	    } else {
	      code = (code & 0xdf) - 65 + 10;
	    }
	    a[i] = code;
	  }
	  return a.reduce(function (acc, c) {
	    acc = 16 * acc + c;
	    return acc;
	  }, 0);
	}

	// 获取8字节hex随机数
	export const getRamNumber = () => {
	  let result = '';
	  for (let i = 0; i < 16; i++) {
	    result += Math.floor(Math.random() * 16).toString(16);
	  }
	  return result.toUpperCase();
	}

	//转小端 低字节在前，高字节在后
	export const dataConversion = (data: any) => {
	  data = data.replace(/\s/g, '').replace(
	    /(.{2})/g, "$1 ");
	  data = data.split(" ").reverse().join("")
	  return data
	}

	// 将一串16进制转成对应的10进制数组
	export const hex2intArr = (str: string) => {
	  if (str.length % 2 !== 0) {
	    console.error('输入的16进制数格式不正确，字符个数不是双数。');
	    return;
	  }
	  const arr = [];
	  for (let i = 0; i < str.length; i += 2) {
	    arr.push(hex2int(str.substr(i, 2)));
	  }
	  return arr;
	};

	//str 转 buff
	export const str2ab = (str: string) => {
	  const buffer = new ArrayBuffer(str.length / 2);
	  let x = new Uint8Array(buffer);
	  for (let i = 0; i < x.length; i++) {
	    x[i] = parseInt(str.substr(2 * i, 2), 16)
	  }
	  return buffer;
	}

	/**
	 * 字符串转arrayBuffer
	 * @param {*} str 需要转换的字符串
	 * @returns 返回 arrayBuffer
	 */
	export const strToArrayBuffer = (str: string) => {
	  var array = new Uint8Array(str.length);
	  for (var i = 0; i < str.length; i++) {
	    array[i] = str.charCodeAt(i);
	  }
	  return array.buffer
	}

	// buff转16进制
	export const ab2hex = (buffer: any) => {
	  let hexArr = Array.prototype.map.call(
	    new Uint8Array(buffer),
	    function (bit) {
	      return ('00' + bit.toString(16)).slice(-2)
	    }
	  )
	  return hexArr.join('');
	}

	// 获取Mac地址
	export const getMacAddress = (advertisData: any) => {
	  const mac = Array.prototype.map
	    .call(new Uint8Array(advertisData), (x) => ("00" + x.toString(16)).slice(-2))
	    .join(":");
	  return mac.toUpperCase();
	}