常用工具类【时间日期处理,数组排序、去重、过滤,对象深拷贝、字符串去除空格、函数防抖节流、添加水印、金钱格式化、枚举对象取值】
/**
* 时间日期格式化 月份日期补0 =》 .toString().padStart(2, "0")
* @param {*} date 时间日期
*/
export const formatter = (date) => {
if (date == "" || date == null) {
return;
} else {
date = new Date(date);
return `${date.getFullYear()}-${(date.getMonth() + 1)
.toString()
.padStart(2, "0")}-${date
.getDate()
.toString()
.padStart(2, "0")}`;
}
}
// 数组排序
export const arraySort = (arryObj) => {
//此为升序,若需降序请自行修改代码if条件大于改为小于
let tmp;
for (let i = 0; i < arryObj.length; i++) {
for (let j = 0; j < arryObj.length; j++) {
if (arryObj[j] > arryObj[j + 1]) {
tmp = arryObj[j];
arryObj[j] = arryObj[j + 1];
arryObj[j + 1] = tmp;
}
}
}
return arryObj;
}
// 数组去重
export const arrayRemoval = (arrayObj) => {
let tmpArray = [];
for (let i = 0; i < arrayObj.length; i++) {
if (tmpArray.indexOf(arrayObj[i]) == -1) {
tmpArray.push(arrayObj[i]);
}
}
return tmpArray;
}
//数组筛选过滤
export const arrayFilter = (arrayObj, keyvalue) => {
let tmpArray = [];
for (let i = 0; i < arrayObj.length; i++) {
if (arrayObj[i].toString().indexOf(keyvalue) != -1) {
tmpArray.push(arrayObj[i]);
}
}
return tmpArray;
}
// 数据深拷贝
//使用方法 供新手参考 :
// 在vue文件中 import { cloneObj } from '@/js_sdk/common.js'
// let dataList = cloneObj(data)
export const cloneObj = (obj) => {
let newobj = obj.constructor === Array ? [] : {};
if (typeof obj !== 'object') {
return;
}
for (let i in obj) {
newobj[i] = typeof obj[i] === 'object' ? cloneObj(obj[i]) : obj[i];
}
return newobj
};
// 字符串去除空格
/**
* @param { string } str 待处理字符串
* @param { number } status 去除空格状态 1-所有空格 2-前后空格 3-前空格 4-后空格 默认为1
*/
export const removeBlank = (str, status = 1) => {
if (status && status !== 1 && status !== 2 && status !== 3 && status !== 4) return;
switch (status) {
case 1:
return str.replace(/\s/g, "");
case 2:
return str.replace(/(^\s)|(\s*$)/g, "");
case 3:
return str.replace(/(^\s)/g, "");
case 4:
return str.replace(/(\s$)/g, "");
default:
return str;
}
}
//函数防抖方法
/**
* @param { function } func
* @param { number } wait 延迟执行毫秒数
* @param { boolean } immediate true 表立即执行,false 表非立即执行
*/
export const debounce = (func, wait, immediate) => {
let timeout;
return function() {
let context = this;
let args = arguments;
if (timeout) clearTimeout(timeout);
if (immediate) {
let callNow = !timeout;
timeout = setTimeout(() => {
timeout = null;
}, wait);
if (callNow) func.apply(context, args)
} else {
timeout = setTimeout(() => {
func.apply(context, args)
}, wait);
}
}
}
//函数节流方法
/**
* @param { function } func 函数
* @param { number } wait 延迟执行毫秒数
* @param { number } type 1 表时间戳版,2 表定时器版
*/
export const throttle = (func, wait, type) => {
let prevIoUs, timeout;
if (type === 1) {
prevIoUs = 0;
} else if (type === 2) {
timeout = null;
}
return function() {
let context = this;
let args = arguments;
if (type === 1) {
let Now = Date.Now();
if (Now - prevIoUs > wait) {
func.apply(context, args);
prevIoUs = Now;
}
} else if (type === 2) {
if (!timeout) {
timeout = setTimeout(() => {
timeout = null;
func.apply(context, args)
}, wait)
}
}
}
}
/**
* 添加水印
* @param {*} content 水印名称
*/
const watermark = ({
container = document.body,
width = "300px",
height = "200px",
textAlign = "center",
textBaseline = "middle",
font = "20px Microsoft Yahei",
fillStyle = "rgba(184, 184, 184, 0.6)",
content = "",
rotate = "30",
zIndex = 1000,
} = {}) => {
const args = arguments[0];
const canvas = document.createElement("canvas");
canvas.setAttribute("width", width);
canvas.setAttribute("height", height);
const ctx = canvas.getContext("2d");
ctx.textAlign = textAlign;
ctx.textBaseline = textBaseline;
ctx.font = font;
ctx.fillStyle = fillStyle;
ctx.rotate((Math.PI / 180) * rotate);
ctx.fillText(content, parseFloat(width) / 2, parseFloat(height) / 2);
const base64Url = canvas.toDataURL();
const __wm = document.querySelector(".__wm");
const watermarkDiv = __wm || document.createElement("div");
const styleStr = `
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
z-index:${zIndex};
pointer-events:none;
background-repeat:repeat;
background-image:url('${base64Url}')`;
watermarkDiv.setAttribute("style", styleStr);
watermarkDiv.classList.add("__wm");
if (!__wm) {
container.style.position = "relative";
container.insertBefore(watermarkDiv, container.firstChild);
}
const MutationObserver =
window.MutationObserver || window.WebKitMutationObserver;
if (MutationObserver) {
let mo = new MutationObserver(function() {
const __wm = document.querySelector(".__wm");
// 只在__wm元素变动才重新调用 __canvasWM
if ((__wm && __wm.getAttribute("style") !== styleStr) || !__wm) {
// 避免一直触发
mo.disconnect();
mo = null;
__canvasWM(JSON.parse(JSON.stringify(args)));
}
});
mo.observe(container, {
attributes: true,
subtree: true,
childList: true,
});
}
};
//判断枚举对象取值
// 在vue文件中 import { enumeration } from '@/js_sdk/common.js'
// let valueStatus = enumeration(enumObj,0);
export const enumeration = (enumObj, index) => {
//enumObj ====> 枚举对象 例如:{0:"不通过",1:"通过",2:"待审批"};
//index ====> 查询属性值或属性名
for (let i in enumObj) {
if (i == index) {
return enumObj[i];
} else if (enumObj[i] == index) {
return i;
}
}
}
// 金钱格式化,三位逗号
export const formatMoney = (num) => {
let newNum = num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
return newNum;
}
export default {
watermark
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。