s-utils

介绍

web端常用js工具方法库，便于项目开发。

systemInfo

// 设备环境
systemInfo = {
  inBrowser,
  ua,
  isMobile,
  isWeixin,
  isIE,
  isIE9,
  isEdge,
  isAndroid,
  isIOS,
  isChrome,
  isIPhone,
  isIPad,
  isWebApp,
  hasTouch,
  mousedown,
  mousemove,
  mouseup,
  windowWidth,
  windowHeight,
}

数据类型

/**
 * @name: 判断是否是此对象上的实例属性
 * @param {object} obj
 * @param {string} prop
 * @return {boolean}
 * @example hasOwnProp({a:1},'a') // true
 */
hasOwnProp(obj, prop)

/**
 * @name: 获取数据类型
 * @param {*} value
 * @return {string}
 * @example getType({}) // object
 */
getType(value)

/**
 * @name: 类型验证获取value，返回默认值
 * @param {*} value
 * @param {Function|Array<Function>} types
 * @param {*} defaultValue
 * @return {*}
 * @example: getTypeValue(1,Number) //1
 * @example: getTypeValue(1,Number,1) //1
 * @example: getTypeValue('0',[String,Number],0) // '0'
 */
getTypeValue(value, types, defaultValue)

/**
 * @name: 判断指定参数是否是一个纯粹的对象
 * @param {object} obj
 * @return {boolean}
 */
isPlainObject(value)

/**
 * @name: 判断是否可以转number
 * @param {String|Number} value
 * @return {boolean}
 * @example isNumber('5') // true
 */
isNumber(value)

/**
 * @name: 判断是否为function
 * @param {*} value
 * @return {boolean}
 * @example isFunction(()=>{}) // true
 */
isFunction(value)

/**
 * @name: 判断是否为object
 * @param {*} value
 * @return {boolean}
 * @example isObject({}) // true
 */
isObject(value)

/**
 * @name: 判断是否为数组
 * @param {*} value
 * @return {boolean}
 * @example isArray([]) // true
 */
isArray(value)

/**
 * @name: 判断是否为类数组
 * @param {*} o
 * @return {boolean}
 * @example isArrayLike({0:1,1:2,length:2}) // true
 */
isArrayLike(value)

/**
 * @name: 转数组
 * @param {*} list
 * @return {array}
 */
toArray(list)

/**
 * @name: 是否为promise对象
 * @param {*} value
 * @return {boolean}
 */
isPromise(value)

/**
 * @name: 判断是不是一个有效值
 * @param {*} val
 * @return {Boolean}
 * @example: isDef(1) // true
 */
isDef(val)

addUnit

/**
 * @name: 添加单位
 * @param {String|Number} value ''
 * @param {String} unit px
 * @return {String} ''
 * @example addUnit(30) // 30px
 */
addUnit(value = '', unit = 'px')

arrayDifference

/**
 * @name: 数组差集
 * @param {Array} arr1
 * @param {Array} arr2
 * @return {Array}
 * @example: arrayDifference([1,2,3],[2,3]) //[1]
 */
arrayDifference(arr1 = [], arr2 = [])

arrayIntersect

/**
 * @name: 数组交集
 * @param {Array} arr1
 * @param {Array} arr2
 * @return {Array}
 * @example: arrayIntersect([1,2,3],[2,3,4]) //[2, 3]
 */
arrayIntersect(arr1 = [], arr2 = [])

arrayUnion

/**
 * @name: 数组并集
 * @param {Array} arr1
 * @param {Array} arr2
 * @return {Array}
 * @example: arrayUnion([1,2,3],[2,3,4]) //[1, 2, 3, 4]
 */
arrayUnion(arr1 = [], arr2 = [])

base64

/**
 * @name: base64加密
 * @param {string} str
 * @return {string}
 * @example encode(123) // MTIz
 */
base64.encode(str)

/**
 * @name: base64解密
 * @param {string} str
 * @return {string}
 * @example decode('MTIz') // 123
 */
base64.decode(str = '')

bridge 与ios原生app交互

/**
 * @name: 在需要调用客户端方法的组件中（事先需要与客户端同事约定好方法名）
 * @param {string} event
 * @param {any} data
 * @param {function(*) void} callback
 * @return {void}
 */
bridge.callhandler(name, data, callback)

/**
 * @name: 当客户端需要调用 js 函数时,事先注册约定好的函数即可
 * @param {string} event
 * @param {function(*,function?):void} callback
 * @return {void}
 */
bridge.registerhandler(name, data, callback)

callPhone 打电话

/**
 * @name: 拨打电话
 * @param {String} phoneNumber
 * @return {void}
 * @example callPhone('15234855555')
 */
callPhone(phoneNumber)

cookieStorage 浏览器cookie操作方法

/**
 * @name: 设置cookie
 * @param {string} key
 * @param {string} value
 * @param {number} days
 * @param {object} options
 * @return {void}
 */
cookieStorage.setItem(name, value, days, params = {})

/**
 * @name: 获取cookie
 * @param {string} key
 * @return {string}
 */
cookieStorage.getItem(name)

/**
 * @name: 删除cookie
 * @param {string} key
 * @param {object} options
 * @return {void}
 */
cookieStorage.removeItem(name, params = {})

/**
 * @name: 清空所有cookie
 * @param {object} options
 * @return {void}
 */
cookieStorage.clear(params = {})

/**
 * @name: 计算属性，获取cookie长度
 * @return {Number}
 */
cookieStorage.length

copyText

/**
 * @name: 复制文本
 * @param {string} value
 * @return {void}
 */
copyText(value)

countDown

/**
 * @name: 倒计时控制器
 * @param {Number} seconds 秒数
 * @param {Function(Number)} callback 每减一秒回掉
 * @param {Function} complete 倒计时完后回掉
 * @param {Number} wait 间隔事件 1000 单位ms
 * @param {Boolean} immediate 初始化是否启动，默认true
 * @return {object} {start:Function(newSeconds),stop:Function} 返回一个对象，可暂停和启动
 * @example countDown(60,second=>console.log(second),()=>console.log('完毕'))
 */
countDown(seconds = 0, callback = noop, complete = noop, wait = 1000, immediate = true)

createTimer

/**
 * @name: 创建一个定时控制器
 * @param {function} fn 每次执行回调
 * @param {number} wait 间隔时间 5000
 * @param {boolean} immediate 初始化是否启动，false
 * @return {object} {start:Function,stop:Function}返回一个对象，可暂停和启动
 * @example createTimer(()=>console.log('执行'),5000)
 */
createTimer(fn, wait = 5000, immediate = false)

debounce

/**
 * @name: 函数防抖
 * @param {function} fn 回调函数
 * @param {number} wait 等待时间ms 默认300毫秒
 * @param {boolean} immediate 首次触发是否立即执行，默认false
 * @return {function}
 * @example debounce(function(){},100)
 */
debounce(fn, wait = 300, immediate = false)

throttle

/**
 * @name: 函数节流
 * @param {Function} fn 回调函数
 * @param {Number} wait 多少时间内必定执行一次
 * @param {Boolean} immediate 首次触发是否立即执行，默认 false
 * @return {Function}
 */
throttle(fn, wait = 300, immediate = false) //返回一个新函数

downloadBlob

/**
 * @name: 浏览器下载blob文件流
 * @param {Blob} blob
 * @param {String} filename
 * @return {void}
 * @example downloadBlob(blob, 'test.xlsx')
 */
downloadBlob(blob, filename)

each

/**
 * @name: 数组和对象循环
 * @param {object|array} obj
 * @param {function(item,key,obj):boolean?} callback(item,key,obj)
 * @return {void}
 * @example each([1,2,3], (item,index,list)=>{})
 */
each(obj, callback)

EventEmit 订阅消息和发布消息

const eventBus = new EventEmit();

// 订阅消息
eventBus.on('message', data => {
  console.log(data);
});

// 发布消息
eventBus.emit('message', 123);

extend

/**
 * @name: 对象合并，对象拷贝
 * @param {object} args
 * @return {object}
 * @example extend(obj,obj1,obj2...) //浅合并  
 * @example extend(true,obj,obj1,obj2...) //深度合并 
 */
extend(...args)

时间相关

/**
 * @name: 判断是否可以转为一个合法的时间对象
 * @param {*} date
 * @return {boolean}
 */
isValidDate(date)

/**
 * @name: 尝试转一个合法Date对象,兼容ios
 * @param {string|Date|number} date
 * @return {Date}
 * @example parseDate('2021-05-17') // Mon May 17 2021 08:00:00 GMT+0800 (中国标准时间)
 */
parseDate(date)

/**
 * @name: 格式化时间
 * @param {Date|Number|String} date
 * @param {String} fmt = 'YYYY-MM-DD HH:mm'
 * @return {String}
 * @example formatDate(new Date(), fmt = 'YYYY-MM-DD HH:mm')
 */
formatDate(date, fmt = 'YYYY-MM-DD HH:mm')

/**
 * @name: 格式化时间段
 * @param {Date|Number|String} startDateTime
 * @param {Date|Number|String} endDateTime
 * @param {String} separator ~
 * @param {String} startformat
 * @param {String} endformat
 * @return {String}
 * @example formatDateRange(new Date(),new Date())
 */
formatDateRange(
  startDateTime,
  endDateTime,
  separator = ' ~ ',
  startformat = 'YYYY-MM-DD HH:mm',
  endformat = 'YYYY-MM-DD HH:mm',
)

/**
 * @name: 格式化日期为今天，明天，后天，周几
 * @param {Date | String | Number} date
 * @param {Number} num 0,1,2,3
 * @return {String}
 * @example formatDay(new Date())
 */
formatDay(date, num)

/**
 * @name: 格式化时间差，
 * @param {Date|Number|String} date
 * @param {Date|Number|String} now 默认与当前时间相比
 * @param {Number} maxDays
 * @param {String} nowStr '刚刚'
 * @return {String}
 * @example formatDiffTime(date, now, maxDays = 7, nowStr = '刚刚')
 */
formatDiffTime(date, now, maxDays = 7, nowStr = '刚刚')

/**
 * @name: 格式化秒数为周，天,小时，分钟，秒 对象
 * @param {Number} seconds
 * @param {String} fmt
 * @return {object} {d,h,m,s}
 * @example formatSeconds(130) // {d: 0, h: 0, m: 2, s: 10}
 */
formatSeconds(seconds, fmt = 'd,h,m,s')

/**
 * @name: 获取某年某月有多少天
 * @param {String|Number} year
 * @param {String|Number} month
 * @return {Number}
 * @example getDaysInMonth(2021,2) // 28
 */
getDaysInMonth(year = '', month = '')

formatMoney

/**
 * @name: 格式化货币
 * @param {Number} number 货币数字
 * @param {Number} places 保留的小位数,2
 * @param {String} symbol 货币符号：'￥'
 * @param {String} thousand 用啥隔开：','
 * @param {String} decimal 表示小数点符合:'.'
 * @return {String}
 * @example formatMoney(12345) // ￥12,345.00
 */
formatMoney(
  number = 0,
  places = 2,
  symbol = '￥',
  thousand = ',',
  decimal = '.'
)

formatNumber

/**
 * @name: 格式化数字
 * @param {Number} number 数字
 * @param {Number} places 保留的小位数,2
 * @param {String} thousand 用啥隔开：','
 * @param {String} decimal 表示小数点:'.'
 * @return {String}
 * @example formatMoney(12345) // 12,345
 */
formatNumber(
  number = 0,
  places = 0,
  thousand = ',',
  decimal = '.'
)

getMatcheds 获取根节点到匹配节点的链数组

/**
 * @name: 获取根节点到匹配节点的链数组
 * @param {Array} list
 * @param {string} childrenKey
 * @param {Function} validator
 * @param {Array} matcheds
 * @return {Array}
 */
getMatcheds(list, childrenKey, validator, matcheds = [])

getRandom

/**
 * @name: 获取指定位数的随机数
 * @param {number} num
 * @return {string}
 * @example getRandom(4) // 0626
 */
getRandom(num)

getUid

/**
 * @name: 生成一个uid，全局唯一标识符
 * @param {Number} len uid的长度
 * @param {Number} radix 进制数
 * @return {String}
 * @example getUid(12) // 18djrujZHyaO
 */
getUid(len = 12, radix = 0)

getUrlParam

/**
 * @name: 获取url参数
 * @param {string} name
 * @param {string?} url 默认 window.location.search
 * @return {string}
 * @example getUrlParam('a','/index?a=1&b=2') // 1
 */
getUrlParam(name, url)

loadImage

/**
 * @name: 加载一张图片
 * @param {String} src
 * @return {Promise}
 */
loadImage(src)

mergeClass

/**
 * @name: 合并多个class
 * @param {String|object|Array<String|object>} classList
 * @return {String} 返回字符串class
 * @example: mergeClass({a:false},{b:true},'c d ',['e f','g',{h:true}]) //b c d e f g h
 */
mergeClass(...classList)

mergeStyle

/**
 * @name: 合并多个style
 * @param {Array<String|object>} styleList
 * @return {String} 返回字符串style，兼容其它端
 * @example: mergeStyle('width:10rpx',{height:'20rpx',zIndex:2},'border:2rpx') //width:10rpx;height:20rpx;z-index:2;border:2rpx
 */
mergeStyle(...styleList)

mergePath

/**
 * @name: 路径拼接
 * @param {String[]} args
 * @return {String}
 * @example mergePath('pages','home') // pages/home
 */
mergePath('a/', '/b/', '/c') // a/b/c

nextFrame

/**
 * @name: 动画执行时机
 * @param {Function} fn
 * @return {void}
 */
nextFrame(fn)

noop 空方法

/**
 * @name: 用于默认Function赋值
 */

privatePhone

/**
 * @name: 隐藏手机号码中的几位数字加密显示
 * @param {String} phone
 * @return {String}
 * @example privatePhone('15234856547') // 152****6547
 */
privatePhone(phone)

toHump

/**
 * @name: -转驼峰
 * @param {String} str 字符串
 * @param {String} mark 转换符号：-
 * @return {String}
 * @example: toHump('border-radius')  // borderRadius
 */
toHump(str = '', mark = '-')

toLine

/**
 * @name: 驼峰转-
 * @param {String} str 字符串
 * @param {String} mark 转换符号：-
 * @return {String}
 * @example: toLine('borderRadius')  // border-radius
 */
toLine(str = '', mark = '-')

toValidListData

/**
 * @name: 把不规则的数据格式转换为统一的数组[{value:'1'，label:'文字'}]数据格式
 * @param {Array|object} data
 * @param {string} valueKey
 * @param {string} labelKey
 * @return {Array}
 */
toValidListData(data, valueKey = 'value', labelKey = 'label')

trim

/**
 * @name: 去掉字符串空格
 * @param {String} str
 * @param {String} pos both：左右2边空格， left：左边空格，right：右边空格，all：全部空格
 * @return {String}
 */
trim(str, pos = 'both')

utf8to16

/**
 * @name: utf8to16
 * @param {String} str
 * @return {String}
 */
utf8to16(str)

utf16to8

/**
 * @name: utf16to8
 * @param {String} str
 * @return {String}
 */
utf16to8(str)

validate 校验方法

/**
 * @name: 是否为整数
 * @param {string|number} val
 * @return {boolean}
 */
validate.isInteger(val)

/**
 * @name: 是否为正确的手机号码格式
 * @param {string} val
 * @return {boolean}
 */
validate.isPhone(val)

/**
 * @name: 是否为电子邮箱地址
 * @param {string} val
 * @return {boolean}
 */
validate.isEmail(val)

/**
 * @name: 是否带有域名
 * @param {string} val
 * @return {boolean}
 */
validate.hasHost(val)

/**
 * @name: 是否带有表情字符
 * @param {string} val
 * @return {boolean}
 */
validate.hasEmoj(val)

/**
 * @name: 是否为有效的身份证号码
 * @param {string} idCard
 * @return {boolean}
 */
validate.isIdCard(idCard)

/**
 * @name: 中文姓名判断
 * @param {string} name
 * @param {number} length
 * @return {boolean}
 */
validate.isNameZh(name, length = 2)

/**
 * @name: 港澳居民来往内地通行证，规则： H/M + 10位或6位数字，样本： H1234567890
 * @param {string} card
 * @return {boolean}
 */
validate.isHKCard(card)

/**
 * @name: 台湾居民来往大陆通行证，规则： 新版8位或18位数字， 旧版 英文字母 + 10位数字，样本： 12345678 或 1234567890B
 * @param {string} card
 * @return {boolean}
 */
validate.isTWCard(card)

/**
 * @name: 中国护照
 * @param {string} val
 * @return {boolean}
 */
validate.isPassport(val)

/**
 * @name: 军官证，规则： 军/兵/士/文/职/广/（其他中文） + "字第" + 4到8位字母或数字 + "号"，样本： 军字第2001988号, 士字第P011816X号
 * @param {string} card
 * @return {boolean}
 */
validate.isOfficerCard(val)

dom 相关

/**
 * @name: 获取或生成dom节点
 * @param {string|Element|Element[]} selector
 * @param {Element} context
 * @return {Element[]}
 * @example getElem('div')
 */
getElem(selector, context)

/**
 * @name: 添加class
 * @param {string|Element|Element[]} selector
 * @param {string} value
 * @return {void}
 * @example addClass('body','class1')
 */
addClass(selector, value)

/**
 * @name: 移除class
 * @param {string|Element|Element[]} selector
 * @param {string} value
 * @return {void}
 * @example removeClass('body', 'class1')
 */
removeClass(selector, value)

/**
 * @name: 获取浏览器中最大z-index值
 * @param {string|Element|Element[]} selector
 * @param {number} minZindex
 * @return {number}
 */
getMaxZindex(selector = '*', minZindex = 1)

/**
 * @name: 获取滚动条宽度
 * @return {Number}
 */
getScrollBarWidth()

/**
 * @name: 使用rem
 * @param {Number} styleWidth
 * @param {Number} remUnit
 * @return {void}
 */
useRem(styleWidth = 375, remUnit = 100)

/**
 * @name: 适配屏幕
 * @param {Number} size 尺寸
 * @param {Number} styleWidth 设计稿尺寸，默认375
 * @return {Number}
 */
shfitSize(size, styleWidth = 375)