Public:
提示:记录一些常用的js类型判断:
- 判断是否某个值是否为对象
// 1.使用 typeof 运算符:
typeof yourValue === 'object' && yourValue !== null
// 2.使用 instanceof 运算符:
yourValue instanceof Object
// 3.使用 Object.prototype.toString.call() 方法:
Object.prototype.toString.call(yourValue) === '[object Object]'
- 判断某个值是否为数组
// 1.使用 Array.isArray() 方法来判断一个值是否为数组 为true则是数组 ,反之亦然.
Array.isArray(value)
//2.Object.prototype.toString.call() 方法:
Object.prototype.toString.call(value) === '[object Array]'
提示:记录一些常用的公共方法:
- 将字典转换为数组对象 ( 若为空对象则返回空数组)
/**
1. {成绩: 99} ---> [{key:'成绩', value:'99'}]
*/
function dictToArray(obj: any) {
if (obj && Object.keys(obj).length !== 0) {
return Object.entries(obj).map(([key, value]) => ({ key, value }));
} else {
return [];
}
}
- 判断值是否为json类型 (若为json类型则返回true ,反之为false)
/**
1. 判断值是否为json类型
*/
function isJson(str: string | object) {
if (typeof str === 'string') {
try {
var obj = JSON.parse(str);
if (typeof obj === 'object' && obj) {
return true;
} else {
return false;
}
} catch (e) {
console.log('error', e);
return false;
}
}
}
- 获取url-search参数(需要使用 @vueuse/core中的方法)
/**
1. 获取url-search参数(history)
2. 需要使用 @vueuse/core 中的useUrlSearchParams和getUrlHashParams方法
3. @param key URL参数key,不传时返回所有参数集合
*/
import { useUrlSearchParams } from '@vueuse/core';
function getUrlParams<T = any>(key?: string): T {
const params = useUrlSearchParams('history', {
write: false,
});
if (key === undefined) return params as any;
const ret = params[key];
if (!ret) return getUrlHashParams(key);
return ret as T;
}
- 打开外部链接 (传入url调用方法即可)
/**
1. @description 打开外部链接
2. @param {string} path
3. @returns {void}
*/
function openLink(path: string): void {
window?.open(path);
}
- 判断字符串中是否存在html格式代码 ( 使用场景 : 一般在判断是否需要使用v-html的时候 )
// 判断字符串中是否存在html格式代码
htmlCase: response => {
const htmlPattern = /(<([^>]+)>)/gi;
if (htmlPattern.test(response)) {
console.log(response,'该响应包含HTML标记');
return true;
} else {
console.log(response,'该响应不包含HTML标记');
return false;
}
},
- 函数防抖,用于将多次执行变为最后一次执行 ( 多次使用回城,不会叠加只会执行一次)
/**
1. @desc 函数防抖,用于将多次执行变为最后一次执行
2. @param {function} func - 需要使用函数防抖的被执行的函数。必传
3. @param {Number} wait - 多少毫秒之内触发,只执行第一次,默认1000ms。可以不传
*/
export function debounce(fn, delay) {
delay = delay || 1000; //默认1s后执行
let timer = null;
return function () {
let context = this;
let arg = arguments;
if (timer) {
clearTimeout(timer);
}
timer = setTimeout(() => {
fn.apply(context, arg);
}, delay);
};
}
- 节流函数, 用于将多次执行变为每隔一段时间执行(技能需要CD ,CD时间内无法再次使用该技能)
/**
* 节流函数, 用于将多次执行变为每隔一段时间执行
* @param fn 事件触发的操作
* @param delay 间隔多少毫秒需要触发一次事件
*/
export function throttle2(fn, delay) {
let timer = null;
return function () {
let context = this;
let args = arguments;
if (!timer) {
timer = setTimeout(function () {
fn.apply(context, args);
clearTimeout(timer);
}, delay);
}
};
}
- 格式化时间
/**
* 格式化时间为年月日时分秒的格式, 格式可以自定义。
* ① 时间戳10位和13位都可以转换成格式化的日期
* ② java8格式的日期和有效的日期都可以转换成定义的日期格式
* @param {Date, string} 都有默认参数
* @example
* parseTime() // 2020-07-17 09:53:07
* parseTime('2018-02-13T06:17') // 2018-02-13 06:17:00
* parseTime('2020/03/02 06:02') // 2020-03-02 06:02:00
* parseTime(1541927611000); //2018-11-11 17:13:21
* parseTime(1541927611000, "{y}年{m}月{d}日 {h}时{m}分{s}秒"); // 2018年11月11日 17时11分31秒
* parseTime(1541927611, "{y}/{m}/{d} {h}:{m}:{s}"); // 2018/11/11 17:11:31
* parseTime(new Date()); //2018-11-11 17:13:21
* parseTime(new Date().getTime()); //2018-11-11 17:13:21
*/
export function parseTime(time = new Date(), cFormat = "{y}-{m}-{d} {h}:{i}:{s}") {
let date;
if (typeof time === "object") {
date = time;
} else {
if (("" + time).length === 10) time = parseInt(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 = cFormat.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
let value = formatObj[key]; // Note: getDay() returns 0 on Sunday
if (key === "a") {
return ["日", "一", "二", "三", "四", "五", "六"][value];
}
if (result.length > 0 && value < 10) {
value = "0" + value;
}
return value || 0;
});
console.log(time_str);
return time_str;
}