前端常用函数积累

摘要：参数对象数组，需要排序的目标要按排序的对象属性名称排序的方向，为从小到大是否使用模式，默认为，注意，使用该参数时前面的必须传入。使用场景想要排列一个对象数组，条件是根据这些对象中的某个属性。

个人常用库积累

本库是完全的es2015模块语法，也使用了ts源码。所以使用commonjs方式导致不可用。

/index.js

根路径的index.js文件为node_modules对外输出的文件，是es6模块方式。

/dist

在dist文件夹里有集成的es6,cjs,umd,borowser方式的文件。

browser.js，umd供浏览器或者amd,cjs使用。

main.cjs.js， commmonjs模式。

module.es.js， es6模式。

npm i cdd-lib

类

实例属性与方法

constructor

interface $time {
  duration?: number
  everyDuration?: null | Function
  dateSeparator?: string
  timeSeparator?: string
  final?: null | Function
  finally?: null | Function
  times?: number
  date:any
}

declare function _Time(): $time;//构造函数
declare interface $time {//time实例
  isRuning: boolean//实例现在的运行状态
  hour: number//小时
  minutes: number//分钟
  seconds: number//秒
  year: number//年
  times:numer//执行timeout时倒数执行的次数
  month: number//月
  day: number//日期
  stamp:number//创建是的时间戳
  duration:number//间隔毫秒数默认1000
  dateSeparator: string//日期分隔符默认-
  timeSeparator: string//时间分隔符默认:
  date: string//日期
  time: string//时间
  ap: string//上午还是下午AM PM
  start(): any//开始循环执行
  stop(): any//结束循环执行
  everyDuration?(parms?: any): any//每次执行的函数
  timeout.timeout():any//倒数执行的函数
  final():cb倒数执行完时执行的回到函数
}

限制一段文字的长短并添加符号，类似String的padEnd，但是该方法是限制和替代而不是补全。

用法：

limitText(str:string,limit:10,rep:".")

eg:

let str = "你好啊，想要去那里，我想去一个好地方"
limitText(str)//=>你好啊，想要去...

对输入的文字进行转义防止注入攻击的函数

深层复制一个对象
虽然现在已经有了Object.assign这样的原生方法，但是有些地方还是要用到自己写的。

用法：

deepClone(obj|array)//=>新的 obj|array

该方法不会拷贝原型的属性。

对元素的某个对象的事件添加节流阀
使用方法:

addThrottle({el, event, handler, model?=0, threshold?=250})

参数：

el：element对象

event：事件名称

handler：监听器处理函数默认参数为e即事件对象

model: 节流阀的模式，0为间隔模式（每次停止时再执行），1为频率模式（比如threshold为250,则每秒发生4次。）

threshold?：可选的临界值，数字，默认是250（目前是指定事件发生的间隔）

如果移除这个监听的话直接使用元素对象的removeEvnetListener(event:string)就行了。

isString

isNumber

isBoolean

isFunction

isNull

isUndefined

isObj

isArray

isDate

isRegExp

isSymbol

isPromise

isSet

isNaN

isFalse

isTrue

isIos

isPc

browserTypeIE11|Edge|FF|Opera|Safari|Chrome

CheckStr(str,type)常用验证
type

phone 手机

tel 座机

card 身份证号

pwd 密码/字母开头长度6-18，只能包含字母数字下划线

postal 邮政

email 邮箱

QQ qq号

URL 网址

money 小数点两位金额

IP ip地址

date 日期

english 英文

chinese 中文

lower 小写

upper 大写

HTML html标签

isCardID(sid) 严格身份证

解析2018-12-12 12:12:12或者2018-12-12此类的文字为Date对象。

sortObj(旧)仍然可用，sorObjArray(新名字)。

sortObj/sortObjArray(
  arr:[obj], 
  property:string|[string|{[prope:string]:boolean}], 
  order:boolean = true, 
  isPromise:boolean=false
  ):[objSorted]

参数：

arr:[obj] 对象数组，需要排序的目标

property:string|[string|{[prope:string]:boolean}] 要按排序的对象属性名称

order:string|boolen 排序的方向，true为从小到大s

isPromise:boolean = false 是否使用Promise模式，默认为false，注意，使用该参数时前面的order必须传入。

1 想要排列一个对象数组，条件是根据这些对象中的某个属性。

var seed = [
  {name:"aaac",age: 12 },
  {name:"ecc",age: 12 },
  {name:"bccd",age: 12 },
  {name:"wds",age: 12 },
  {name:"esds",age: 12 },
  {name:"esds",age: 9},
];
// 根据名字从小到da排序
sortObjArrary(seed,"name")
// 根据名字从大到小排序
sortObjArrary(seed,"name",false)

2 还是排序上面的数据，要求是，根据名字排序，如果名字相同则根据年龄排序

// 名字相同时根据年龄从小到大排序
sortObjArray(seed,["name","age"])
// 或者
sortObjArray(seed,["name",{age:true}])
// 名字相同时根据年龄从大到小排序
sortObjArray(seed,["name",{age:false}])

返回排序后的新的数组

对于对象数组根据其属性进行排序的方法

下载文件

创建dom

生成指定长度的文字，最低为5个

截取文件的后缀名
filename:文件名字
keepDot:是否保持点"."，默认为false

小程序请求，结合promise使用axios风格

interface $request {
  (url: string | anyObj | $reqSet, config?: anyObj): Promise
  get?(url: string, config?: any): Promise
  post?(url: string, data?: anyObj, config?: any): Promise
  put?(url: string, data?: anyObj, config?: any): Promise
  head?(url: string, config?: any): Promise
  options?(url: string, config?: any): Promise
  delete?(url: string, config?: any): Promise
  interceptors?: {
    request: { use(a: $interRequest, b?: $interRequesError): any },
    response: { use(handle: $interResponse): any }
  }
  [name: string]: any
}

小程序中store2风格的本地存储

interface wxStore2 {
  (key?: any, data?: any): Promise | void
  get(key: string): any
  set(key: string, data: any): any
  transact(key: string, data: Function): any
  clear(): void
  has(key: string): boolean
  remove(key: string): any
  getAll(): anyObj
  add(key: string, data: any): any
  keys(): any
  size(): number
  clearAll(): void
  isPromise: boolean
  nameSpace: string | undefined
  create(): $store2
}

camelToUnderline(str:string,sperator?="_"):string

underlineToCamel(str:string):string

新整理了样式关系

base-config.styl

基础的设置，如颜色尺寸什么的。

theme.styl

风格主题

lib.styl

主要是一些函数

mixins.styl

mixin的一些样式

reset.styl

浏览器样式重置

index.styl

包含上述所有

libmix.styl

包含上述除了reset.styl和index.styl之外的所有。