常用的功能函数

(1): 功能函数

1: 回到顶部

Vue.prototype.$scrollTo = (x = 0, y = 0, type = 'smooth') => {window.scrollTo({top: x,left: y,behavior: type // 滚动行为:smooth平滑滚动,instant瞬间滚动,默认值auto,等同于instant})
}

2: 判断传递过来的值是否为空

//判断传过来的值是否为空
export function isNull(data) {if(data == '' || data == null || data == undefined ){return true}return false
}
// 或者使用includes
export function isNull(data) {let arr = [undefined,"",false,null]return arr.includes(data)
}// 或者使用空值合并(注意空值合并只会检验null和undefined,不推荐)// !!(data?? "") 这样写的也有个弊端就是对于 输入框中 输入的 0 NaN 和 false都是返回为falseexport function isNull(data) {let flag = !!(data?? "")return flag
}

3: 函数防抖

export function debounce(fn,delay=500) {let timer = null;return function() {if(timer)  clearTimeout(timer)timer = setTimeout(()=>{fn.apply(this,arguments)},delay)}
}

4: 函数节流

export function throttle(fn,wait=500) {let previous = 0;return function() {let now = Date.now();if(now - previous > wait) {fn.apply(this,arguments)}}
}

5: 验证手机号

export function validatePhone(phone) {let pattern = /^1[3,4,5,7,8,9]\d{9}$/;if (pattern.test(phone)) {return true;} else {return false;}
}

6: 验证邮箱

export function validateEmail(email) {let pattern = /^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/;if (pattern.test(email)) {return true;} else {return false;}
}

6+: 倒计时实现

 // 倒计时timeDown(endTime){//获取时间差let now = new Date().getTime()/1000let totalSeconds = parseInt((endTime - now));//天数var days = Math.floor(totalSeconds / (60 * 60 * 24));//取模(余数)var modulo = totalSeconds % (60 * 60 * 24);//小时数var hours = Math.floor(modulo / (60 * 60));modulo = modulo % (60 * 60);//分钟var minutes = Math.floor(modulo / 60);//秒var seconds = modulo % 60;//输出还剩多少时间return `${days}天 ${hours}小时 ${minutes}分 ${seconds}秒`},

7: 验证密码

export function isPassword(pwd) {let pattern = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{8,16}$/;return pattern.test(pwd);
}

8: 证件照

/**** @param {string} number - 证件号码* @param {number | string} type = 1 - 证件类型 1:身份证 2:护照*/
export function isIDNo(number, type = 1) {let pattern;const _type = +type;switch (_type) {case 1:pattern = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;break;case 2:pattern = /^[a-zA-Z0-9]{5,17}$/;break;default:return true;}return pattern.test(number);
}

9: 验证对象是否为空

/*** 判断是否为空对象* @param {Object} obj* @returns {boolean}*/第一种写法:
export function isEmptyObj(obj) {let isEmpty = true;for (let key in obj) {if (key) {isEmpty = false;break;}}return isEmpty;
}
第二种写法:
export function isEmptyObj1(obj) {let obj1 = JSON.stringify(obj)if(obj1 === "{}"){return true}return false
}

10: 日期格式转换

// 第一种写法
function dateTimeFiter(num) {// 时间戳数据处理let date = new Date(num);// 时间戳为10位需*1000,时间戳为13位的话不需乘1000let y = date.getFullYear();let MM = date.getMonth() + 1;MM = MM < 10 ? "0" + MM : MM; // 月补0let d = date.getDate();d = d < 10 ? "0" + d : d; // 天补0let h = date.getHours();h = h < 10 ? "0" + h : h; // 小时补0let m = date.getMinutes();m = m < 10 ? "0" + m : m; // 分钟补0let s = date.getSeconds();s = s < 10 ? "0" + s : s; // 秒补0return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
}
// 第二种写法function dateTimeFiter(num) {// 时间戳数据处理let date = new Date(num);// 时间戳为10位需*1000,时间戳为13位的话不需乘1000let y = date.getFullYear();let MM = date.getMonth() + 1;MM = MM.toString().padStart(2,"0")let d = date.getDate();d = d.toString().padStart(2,"0")let h = date.getHours();h = h.toString().padStart(2,"0")let m = date.getMinutes();m = m.toString().padStart(2,"0")let s = date.getSeconds();s = s.toString().padStart(2,"0")return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
}
// 第三种写法function dateTimeFiter(num) {// 时间戳数据处理let date = new Date(num);// 时间戳为10位需*1000,时间戳为13位的话不需乘1000let y = date.getFullYear();let MM = date.getMonth() + 1;MM = MM < 10 ? "0" + MM : MM; // 月补0let d = date.getDate();d = padNum(d)let h = date.getHours();h = padNum(h)let m = date.getMinutes();m = padNum(m)let s = date.getSeconds();s = padNum(h)return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
}function padNum(num) {return num < 10 ? "0" + num : num}export default dateTimeFiter
// 第四种写法
function fromatDate(fmt, dateTime) {let date = dateTime ? dateTime : new Date()var o = {"Y+": date.getFullYear(), // 年份"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;
}export default fromatDate如果日期复杂可以使用 day.js 或者 moment.js

11: 获取文件的大小

bytesToSize(bytes) {if (bytes === 0) return '0 KB';var k = 1000, // or 1024sizes = ['KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],i = Math.floor(Math.log(bytes) / Math.log(k));return (bytes / Math.pow(k, i)).toPrecision(3) + ' ' + sizes[i];
},
使用import tool from '@/common/tool.js';filters: {formatCurrentSize(value) {return tool.bytesToSize(value);}},<text slot="footer">{{ currentSize | formatCurrentSize }}</text>

12: 生成随机字符串

const random = function(min, max) { // 生成随机数范围 if (arguments.length === 2) { return Math.floor(min + Math.random() * ((max + 1) - min)) }else {  return null}
}
export default random

13: 获取search参数并且组成一个对象

var paramsString = "https://blog.csdn.net/lxs19930928?spm=1010.2135.3001.5421&name=张三"
function getSearchParams(url) {var arr = url.split("?")var searchParams = new URLSearchParams(arr[1]);var obj = {}for (let [key,val] of searchParams) {obj[key]=val}return obj
}
getSearchParams(paramsString) // {spm: '1010.2135.3001.5421', name: '张三'}// 或者使用qs转换import qs from 'qs'function getSearchParams(url) {let index = url.lastIndexOf("?")+1var params = url.slice(index)let parseObj = qs.parse(params)console.log("parseObj",parseObj) // {spm: '1010.2135.3001.5421', name: '张三'}return parseObj}export default getSearchParams

14: 千分位分隔符

var num=12345678.32423432;
function (num) {return num.toString().replace(/\d+/, (p) => {return p.replace(/\d(?=(\d{3})+$)+/g, (p1, p2) => {return p1 + ','})})
}
console.log(regForm(num));//12,345,678.32423432
export default regForm

(2):支付宝小程序常用的功能函数

/* 各种环境check方法:1.支付宝浏览器 checkAlipay2.支付宝小程序 checkAlipayApp3.平台app checkApp4.ios浏览器 checkIos5.安卓浏览器 checkAndroid6.微信浏览器 checkWeixin7.微信小程序 checkWeixinApp8.获取APP版本号 getAppVersion9.获取APP ticket getAppTicket
*/// 支付宝浏览器
const checkAlipay = function () {if (navigator.userAgent.toLowerCase().indexOf('alipayclient') > -1) {return true} else {return false}
}// 支付宝小程序
const checkAlipayApp = function () {if (navigator.userAgent.toLowerCase().indexOf('alipayclient') > -1 && (navigator.userAgent.toLowerCase().indexOf('miniprogram') > -1 ||navigator.userAgent.toLowerCase().indexOf('alipayide/webview') > -1)) {return true} else {return false}
}// 平台app
const checkApp = function () {if (/(pigcmso2oreallifeapp)/.test(navigator.userAgent.toLowerCase())) {return true} else {return false}
}// ios浏览器
const checkIos = function () {if (/(iphone|ipad|ipod)/.test(navigator.userAgent.toLowerCase())) {return true} else {return false}
}// 安卓浏览器
const checkAndroid = function () {if (/(android)/.test(navigator.userAgent.toLowerCase())) {return true} else {return false}
}// 微信浏览器
const checkWeixin = function () {if (/(micromessenger)/.test(navigator.userAgent.toLowerCase())) {return true} else {return false}
}// 微信小程序
const checkWeixinApp = function () {if (window.__wxjs_environment === 'miniprogram' || (checkWeixin() && /(miniprogram)/.test(navigator.userAgent.toLowerCase()))) {return true} else {return false}
}// 获取APP版本号
const getAppVersion = function () {var reg = /versioncode=(.*?),/;var arr = reg.exec(navigator.userAgent.toLowerCase());if (arr == null) {return '85'} else {return arr[1]}
}const getAppTicket = function () {var reg = /ticket=(.*?),/var arr = reg.exec(navigator.userAgent)if (arr == null) {return ''} else {return arr[1]}
}export default {checkAlipay,checkAlipayApp,checkApp,checkIos,checkAndroid,checkWeixin,checkWeixinApp,getAppVersion,getAppTicket
}

(3):moment.js

下载moment.js

 yarn add -D momentmoment(new Date()).format('YYYY-MM-DD HH:mm:ss'); // 2022-01-01 16:37:44moment("2021-10-23").format('YYYY-MM-DD HH:mm:ss'); // 2021-10-23 00:00:00moment("2021-10-23").format('YYYY-MM-DD HH:mm:ss'); // 2021-10-20 00:00:00
import moment from "moment";/*** 格式化时间* @param {*} dataStr* @param {*} pattern*/
const formatDateTime = function(dataStr, pattern = "YYYY-MM-DD HH:mm:ss") {return dataStr ? moment(dataStr).format(pattern) : "";
};/*** 时间格式化* @param {*} dataStr* @param {*} pattern*/
const formatTime = function(dataStr) {return formatDateTime(dataStr, "HH:mm:ss");
};/*** 日期格式化* @param {*} dataStr* @param {*} pattern*/
const formatDate = function(dataStr) {return formatDateTime(dataStr, "YYYY-MM-DD");
};export default {formatDateTime,formatTime,formatDate,};

javascript-鄙人常用的功能函数相关推荐

  1. 常用turtle功能函数

    turtle部分功能函数 #turtle常用命令汇总,括号中的参数仅仅作为举例使用,可根据需要修改 import turtle #导入turtle功能模块 # 前进 后退 转向 forward bac ...

  2. javascript数组常用高阶函数

    一·数组常用高阶函数 Array.prototype.filter() 此方法接收一个回调函数作为参数,回调参数接受三个参数,item(源数组中的每一个元素).index(数组下标).arr(源数组) ...

  3. MT4/MQL4入门到精通EA教程第八课-MQL语言常用函数(八)-常用时间功能函数

    时间功能函数详解 TimeCurrent(); //返回服务器当前时间 TimeDayOfWeek();//返回当前时间星期几 TimeGMT(); //返回GTM时间 TimeGMTOffset() ...

  4. WordPress常用主题功能函数

    <?php//--------------------------------------------------------引入后台框架---------------------------- ...

  5. JavaScript中常用内置函数

    JavaScript中有两种函数:一种是语言内部事先定义好的函数叫内置函数,另一种是自己定义的函数.如下是常用的6种内置函数: eval函数 eval(expr)函数可以把一个字符串当作一个JavaS ...

  6. python中的turtle函数_1.常用turtle功能函数

    #turtle常用命令汇总,括号中的参数仅仅作为举例使用,可根据需要修改 #设置画面背景色 turtle.bgcolor("black") #设置窗口大小和在屏幕上的坐标 turt ...

  7. MT4/MQL4入门到精通EA教程第六课-MQL语言常用函数(六)-常用订单功能函数

    bool OrderClose() 平仓函数,该函数有5个参数 bool OrderClose( int ticket, // 订单号double lots, // 手数double price, / ...

  8. MT4/MQL4入门到精通EA课程第二课-常用的功能函数

    AccountBalance(); // 返回当前账户的余额. AccountEquity(); // 返回当前账户的净值. AccountFreeMargin(); // 返回当前账户可用预付款. ...

  9. 一些c中常用的功能函数

    判断一个数是否为素数 int prime(int x) {int count = 0;int i;for (i = 1; i <= x; i++){if (0 == x%i){count++;} ...

最新文章

  1. 远哥教你MuleESB系列视频教程
  2. try、catch、finally的执行顺序
  3. [PAT乙级]1031 查验身份证
  4. php日期相减函数,倒计时函数_计算两个时间相差值_PHP函数
  5. my batis plus 小数没有0_北师大版五年级第一单元小数除法知识点总结及易错题解析(1)...
  6. MapXtreme2004 连接oracle spatial的问题
  7. 50. Pow(x, n) (MATH)
  8. 《实变函数简明教程》,P115,第14题(利用Lebesgue控制收敛定理求函数列Lebesgue积分的极限)
  9. 云中漫步-柴米油盐之上
  10. 电商运营数据分析常用分析指标--概述及流量指标
  11. 用C语言画一个Q版奥特曼
  12. Java 使用POI 给Word添加水印
  13. 企业寄件自定义短信通知教程
  14. 解决pycharm Python helpers are not copied yet to the remote host. Please wait until remote interpreter
  15. opencv-之轮廓外接圆
  16. 如何使用python insert插入数据
  17. 基于Android系统的人脸识别签到软件
  18. COSCOI拥有知识产权的“Go East”角色在东南亚大受欢迎,为全球扩张铺平道路
  19. 英特尔Realsense学习笔记二:pyqt5 实时显示 Realsense D415 深度图像和彩色图像
  20. ANSYS Workbench 18.0结构强度刚度与轻量化分析视频教程

热门文章

  1. 项管行知04--项目章程
  2. 【网易互娱内推】2023届秋招提前批内推码:x8aiNS
  3. ubuntu 安装GPU黑屏 修改GRUB_Ubuntu 18.04 安装笔记
  4. c语言逻辑运算符两侧运算对象,逻辑运算符两侧运算对象的数据类型是什么?...
  5. 【高数-2】多元函数最值
  6. VTK读取序列DCM格式医学图像
  7. 关于菜鸡学习时服务器购买的注意点
  8. OpenEuler树莓派基础实验 20212802范辰宇
  9. Orion2 CDM 操作系统-操作部分20211206
  10. Python爬虫实例--新浪热搜榜[xpath语法]