some practical js methods
npm install wininit
Using npm
$ npm install wininit --save
Using yarn
$ yarn add wininit --dev
`
使用
`
import Win from "wininit"
In Vue
Vue.prototype.$win = Win
使用时
this.$win...
In React
React.$win = Win
使用时
React.$win...
`
参数
`
{
lg : 1920 大屏尺寸 (暂时未用到)
sm : 750 手机端尺寸
second : 1000 一秒所占微秒
minute : 1000 * 60 一分钟所占微秒
hour : 1000 60 60 一小时所占微秒
day : 1000 60 60 * 24 一天所占微秒
}
`
方法
#### 浏览器属性
##### 浏览器标志
device: {}
`
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
}
`
##### 窗口当前宽度
width: number
`
Win.width
console.log( Win.width ) // 1920
`
##### 窗口当前高度
height: number
`
Win.height
console.log( Win.height ) // 1080
`
##### 根域名(包括协议部分)
root: string
`
Win.root
console.log( Win.root )
// https://www.npmjs.com/package/wininit -> https://www.npmjs.com
`
##### 协议
protocol: string
`
Win.protocol
console.log( Win.protocol )
// https://www.npmjs.com/package/wininit -> https:
`
##### 域名(不包括协议部分)
href: string
`
Win.href
console.log( Win.href )
// https://www.npmjs.com/package/wininit -> www.npmjs.com/package/wininit
`
##### 路径
pathname: string
`
Win.pathname
console.log( Win.pathname )
// https://www.npmjs.com/package/wininit -> /package/wininit
`
##### 参数
qs: string
`
Win.qs
console.log( Win.qs )
// https://www.npmjs.com/package/wininit?id=1 -> id=1
`
##### hash
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: number | string
`
Win.st
console.log( Win.st ) // 浏览器滚动条当前位置
Win.st = 100 // 使浏览器滚动条滚动到 100 的位置
`
##### 页面可滚动高度
scrollHeight: number
`
Win.scrollHeight
console.log( Win.scrollHeight ) // 页面可滚动高度
`
##### 页面实际高度
clientHeight: number
`
Win.clientHeight
console.log( Win.clientHeight ) // 页面实际高度
`
##### 页面剩余滚动高度
isScrollBottom: number
`
Win.isScrollBottom
console.log( Win.isScrollBottom ) // 页面剩余滚动高度
`
##### 当前页面标题
title: number
`
Win.title
console.log( Win.title ) // document.title
Win.title = "标题" // 设置当前页面标题
`
$3
##### 判断是否为错误数据
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 位乱码
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
`
##### 判断是否为数组
> 假数组返回 false
isArray(o: any): boolean
`
Win.isArray([1]) // true
Win.isArray({a: 1}) // false
Win.isArray({0: 1, 1: 2}) // false
Win.isArray( document.querySelectorAll('p') ) // false
`
##### 将所有参数 合并 并 降维 为一维数组
toArray(...arg): array
`
Win.toArray([1], [2, 3]) // [1, 2, 3]
Win.toArray([1, [2, 3]], [4]) // [1, 2, 3, 4]
Win.toArray([1, [2, [3]]], [4]) // [1, 2, 3, 4]
`
##### 将数组分页
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]
`
##### 字符串检查
testTxt(t: string, f: string): object | boolean
> t: 要监测的字符串
> f: 监测格式 可选
> phone ( 手机号 | 座机 )
> mail ( 邮箱 )
> idCard ( 身份证号 )
`
Win.testTxt('123', 'phone') // false
Win.testTxt('1186@qq.com', 'mail') // true
Win.testTxt('123', 'idCard') // false
如果第二个参数不写 则返回整个对象
Win.testTxt('1186@qq.com')
// {
// phone: false,
// mail: true,
// idCard: false
// }
如果第二个参数不是 phone, mail, idCard 中的任何一个
则会对两个参数进行比较并返回值
Win.testTxt('123', '123') // true
Win.testTxt('123', '1234') // false
`
##### 获取页面元素
dq(e: string): array | HTMLElement | undefined
> 参数可以是任何标签选择器
> 如果选择器获取到唯一元素则直接返回该元素
> 如果获取到的元素不唯一 则返回包含所有获取到的元素的集合
`
Win.dq("#main") // 返回 id 为 main 的元素
Win.dq("p") // 返回包含所有 p 元素的数组
`
##### 将 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
`
##### 从 LocalStorage 中获取值
getLocalStorage(n: string): any
`
Win.getLocalStorage('token') // 123
`
##### 向 LocalStorage 中添加值
setLocalStorage(n: string, v: any): void
`
Win.setLocalStorage('token', 123) // 123
`
##### 将 LocalStorage 中的某个值删除
delLocalStorage(n: string): void
`
Win.delLocalStorage('token') // 123
`
##### 从 Session 中获取值
getSession(n: string): any
`
Win.getSession('token') // 123
`
##### 向 Session 中添加值
setSession(n: string, v: any): void
`
Win.setSession('token', 123) // 123
`
##### 将 Session 中的某个值删除
delSession(n: string): void
`
Win.delSession('token') // 123
`
##### 刷新页面
reload(force = false): void
> force 为真则跳过缓存刷新
`
Win.reload() // 刷新当前页面
Win.reload(true) // 跳过缓存刷新当前页面
`
##### 将 px 转换为 vw 值
px2vw(px: string | number, width: string | number = this.default.sm): number
> 标尺默认使用 default.sm
`
Win.px2vw(75) // 10
Win.px2vw(375) // 50
`
$3
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
`
$3
> 引入路径
> import { } from "wininit/fun/games"
#### 有趣的 console.log
##### fbilog FBI WARNING
fbilog()
##### blackman 黑人抬棺
blackman()`