JS Code block 代码块–Function 函数

星期一, 2023-04-17 | Author: Lee | computer, 前端 | 514 views

Function 函数
提供一些常用的函数功能

防抖
节流
等待
格式化银行卡
对css属性针对不同浏览器加私有前缀

/**
 * @name 防抖
 * @param {function} [fn=v=>v] 函数
 * @param {number} [dura=50] 时延
 */
function Debounce(fn = v => v, dura = 50) {
	let timer = null;
	return function(...args) {
		timer && clearTimeout(timer);
		timer = setTimeout(() => fn.apply(this, args), dura);
	};
}
 
/**
 * @name 节流
 * @param {function} [fn=v=>v] 函数
 * @param {number} [dura=50] 时延
 */
function Throttle(fn = v => v, dura = 50) {
	let pass = 0;
	return function(...args) {
		const now = +new Date();
		if (now - pass > dura) {
			pass = now;
			fn.apply(this, args);
		}
	};
}
// function handle() {      
//     console.log(Math.random());
// } 
// window.addEventListener('scroll', Throttle(handle, 1000));
 
/**
 * @name 等待
 * @param {number} [dura=1000] 时延
 */
async function WaitFor(dura = 1000) {
	return new Promise(resolve => setTimeout(() => resolve(true), dura));
}
 
/**
 * 格式化银行卡 
 * 用户在输入银行卡号时,需要以4位4位的形式显示,就是每隔4位加个空格,方便用户校对输入的银行卡是否正确<br>
 * **注:**一般数据库里面存的都是不带格式的原始数据,所以提交的时候记得过滤下空格再提交哦。毕竟格式化这种算是表现层,前端展示的时候处理下就好,业务逻辑什么用到的卡号可不是格式化后的呢。<br>
 * 还原`val.replace(/\s/g, '');`
 * @param {string} val
 * @returns {*}
 * @example
 * formatBankCard('6225365271562822');
 * // => 6225 3652 7156 2822
 */
function formatBankCard(val) {
  if (typeof val !== 'string') throw new Error('输入值必须为字符串');
 
  const len = val.length;
  const reg = /(\d{4})(?=\d)/g;
 
  if (len < 4) {
    return val;
  } else {
    return val.replace(reg, '$1 ');
  }
}
 
/**
 * @desc 对css属性针对不同浏览器加私有前缀
 * @desc 先计算下当前浏览器支持那个前缀,支持哪个,就增加那个前缀。并不是把所有的前缀。
 * style: 是字符串,例如: transform
 * return: 字符串 。例如: webkitTransform (驼峰模式,js插入css的属性都是驼峰格式)
 */
function prefixStyle (style) {
    let vendor = (() => {
        let elementStyle = document.createElement('div').style
        let tranformNames = {
            webkit: 'webkitTransform',
            Moz: 'MozTransform',
            O: 'OTransform',
            ms: 'msTransform',
            standard: 'transform',
        }
        for (let key in tranformNames) {
            if (elementStyle[tranformNames[key]] !== undefined) {
                return key
            }
        }
        return false
    })()
    if (vendor === false) {
        return false
    }
    if (vendor === 'standard') {
        return style
    }
    return vendor + style.charAt(0).toUpperCase() + style.substr(1)
}

Tags:

文章作者: Lee

本文地址: https://www.pomelolee.com/2377.html

除非注明,Pomelo Lee文章均为原创,转载请以链接形式标明本文地址

No comments yet.

Leave a comment

Search

文章分类

Links

Meta