js-method-sets v1.1.0
js-method-sets JS 常用方法 ( ES6 模块 暂 )
暂时只支持 ES6 模块
CommonJs / CMD 后期会逐步更新支持
安装
# Using npm
$ npm install js-method-sets --save
# Using yarn
$ yarn add js-method-sets --dev
使用
import Win from "js-method-sets"
# In Vue
Vue.prototype.$win = Win
使用时
this.$win...
# In React
React.$win = Win
使用时
React.$win...
方法
浏览器属性
浏览器标志
interface device{
[key]: boolean
}
Win.device = {
isPc 是否是 PC 端
isQB 是否是 QQ浏览器
isUC 是否是 UC浏览器
isIos 是否是 iOS浏览器
isIpad 是否是 Ipad
isWeChat 是否是 微信浏览器
isChrome 是否是 Chrome浏览器
isSafari 是否是 Safari浏览器
isAndroid 是否是 Android
isFireFox 是否是 火狐浏览器
isWindowsPhone 是否是 windows 手机浏览器
}
# 例子
if ( Win.device.isPc ) {
todo something
} else {
todo something
}
窗口当前宽度
跟随实时屏幕宽度, 可以直接在resize
事件中直接使用
type width: number
Win.width
console.log( Win.width ) // 1920
窗口当前高度
跟随实时屏幕高度, 可以直接在resize
事件中直接使用
type height: number
Win.height
console.log( Win.height ) // 1080
根域名(包括协议部分)
type root: string
Win.root
console.log( Win.root )
// https://www.npmjs.com/package/wininit -> https://www.npmjs.com
协议
type protocol: string
Win.protocol
console.log( Win.protocol )
// https://www.npmjs.com/package/wininit -> https:
域名(不包括协议部分)
type href: string
Win.href
console.log( Win.href )
// https://www.npmjs.com/package/wininit -> www.npmjs.com/package/wininit
路径
type pathname: string
Win.pathname
console.log( Win.pathname )
// https://www.npmjs.com/package/wininit -> /package/wininit
参数
type qs: string
Win.qs
console.log( Win.qs )
// https://www.npmjs.com/package/wininit?id=1 -> id=1
hash
对 hash
赋值会直接改变当前页面 hash
值
type hash: string
Win.hash
console.log( Win.hash )
// https://www.npmjs.com/package/wininit#hash -> hash
Win.hash = "index"
// https://www.npmjs.com/package/wininit#hash -> https://www.npmjs.com/package/wininit#index
获取当前滚动条位置
对st
赋值会直接修改当前滚动条位置
type st: number
Win.st
console.log( Win.st ) // 浏览器滚动条当前位置
Win.st = 100 // 使浏览器滚动条滚动到 100 的位置
页面可滚动高度
type scrollHeight: number
Win.scrollHeight
console.log( Win.scrollHeight ) // 页面可滚动高度
页面实际高度
type clientHeight: number
Win.clientHeight
console.log( Win.clientHeight ) // 页面实际高度
页面剩余滚动高度
type isScrollBottom: number
Win.isScrollBottom
console.log( Win.isScrollBottom ) // 页面剩余滚动高度
当前页面标题
对title
赋值会直接修改当前页面标题
type title: number
Win.title
console.log( Win.title ) // document.title
Win.title = "标题" // 设置当前页面标题
通用方法
判断是否为错误数据
isNever(value: any): boolean
Win.isNever(0) // false
Win.isNever('') // true
Win.isNever(+'a') // true
Win.isNever(null) // true
Win.isNever(false) // true
Win.isNever(undefined) // true
生成随机乱码
默认生成 15 位乱码;
参数a
如果类型为string
, 则该字符串必须能为纯数字字符串, 可以直接被转换为数字而不是NaN
uid(a: string | number, s = ""): string
Win.uid() // 生成 15 位随机码 -> 示例: qwertyuiopasdfg
Win.uid(2) // 生成 2 位随机码 示例: de
Win.uid(15, 'default') // 生成 15 位随机码并将第二个参数添加到段首 示例: defaultqwertyuiopasdfg
范围内生成随机整数
random(b: number, a: number): number
# 没有参数则返回 0 - 10 随机数
Win.random() // 返回 0 - 10 随机数
# 只有一个参数则返回 0 至此参数之间的一个随机整数( 包含上下限 )
Win.random(20) // 生成 0 - 20 之间的一个随机整数 eg: 7
# 两个参数则返回这两个参数之间的一个随机整数( 包含上下限 )
Win.random(20, 2) // 生成 2 - 20 之间的一个随机整数 eg: 13
将数组分页
paging(a: array, n: number): array
a: array 需要分页的数组
n: number 每页个数
Win.paging([1, 2, 3, 4], 2) // [[1, 2], [3, 4]]
随机打乱数组
shuffle(a: array): array
Win.shuffle([1, 2, 3, 4]) // [3, 2, 4, 1]
值检查
validation(text: string, format: string): object | boolean
text: 要监测的字符串
format: 监测格式 可选
phone 手机号
mail 邮箱
idCard 身份证号
number 纯数字
url 域名(携带: http|https)
ip ip 地址
chinese 中文
html html 标签
Win.validation('123', 'phone') // false
Win.validation('1*********@qq.com', 'mail') // true
Win.validation('123', 'idCard') // false
# 如果第二个参数不写 则返回整个对象
Win.validation('11******86@qq.com')
// {
// phone: false,
// mail: true,
// idCard: false
// }
# 如果第二个参数不是 phone, mail, idCard 中的任何一个
# 则会对两个参数进行比较并返回值
Win.validation('123', '123') // true
Win.validation('123', '1234') // false
将 file 对象转换为临时预览图片
getInputPic(file: File): Promise
Win.getInputPic([File]).then(src => {
# src 图片临时地址
image.src = src
})
格式化时间
formatDate(str: string, date: Date | string): string
Win.formatDate('yyyy-MM-dd', new Date()) // 2020-01-01
Win.formatDate('yyyy-M-d', new Date()) // 2020-1-1
Win.formatDate('yyyy-MM-dd hh:mm:ss', new Date()) // 2020-01-01 12:12:12
Win.formatDate('yyyy-MM-dd h:m:s', new Date()) // 2020-01-01 5:2:1
Win.formatDate('yy年M月d h:m:s', '2020-05-22 5:20:58') // 20年5月22 5:20:58
在页面引入 JavaScript
需要在浏览器环境使用,
uniapp
中只有H5
环境支持
injectScript(src: string): void
injectScript('JavaScript Src')
判断元素是否在窗口视区
elIsVisibleInViewport(element: HtmlElement, partiallyVisible: boolean): boolean
element 要判断的元素
partiallyVisible 元素是否完整的在屏幕显示区域内
elIsVisibleInViewport(document.getElementById('main'))
将数字转换为中文
numberToChinese(n: number): string
numberToChinese(1000) // 一仟
numberToChinese(1010) // 一仟零一十
日期比较计算
Win.computeDate
日期比较
Win.computeDate.compare(fdate, ndate): boolean
前面的日期小则返回 false 否则返回 true
Win.computeDate.compare('2020-5-1', '2020-5-2') // false
Win.computeDate.compare(new Date('2020-5-1'), new Date('2020-5-2')) // false
日期差值
Win.computeDate.second(fdate, ndate): number
两个日期相差秒数
Win.computeDate.minute(fdate, ndate): number
两个日期相差分钟
Win.computeDate.hour(fdate, ndate): number
两个日期相差小时
Win.computeDate.day(fdate, ndate): number
两个日期相差天数
Win.computeDate.day('2020-5-1', '2020-5-2') // 1
Win.computeDate.hour(new Date('2020-5-1'), new Date('2020-5-2')) // 24
Fun 娱乐
引入路径
import { } from "wininit/fun/games"
有趣的 console.log
fbilog FBI WARNING
fbilog()
blackman 黑人抬棺
blackman()
Made In Li mengqun.