npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

front-uitls

v1.2.3

Published

this is a simple front-end tool for opening source development

Downloads

25

Readme

front-uitls

Install

[npm][]:

$ npm install front-uitls

front-uitls 是一个简单的前端工具库, 提供各种前端常用而且便捷的方法 可以快速使用 主旨在提供一套逻辑判断的全面js方法库

Use

import {isIE, inBrowser, isIE, isIE9, isEdge, isAndroid, isIOS, ...} from 'front-uitls'

API

  • hasProto [type Boolcan] ( 判断是否存在隐形原型'proto' )

  • inBrowser [type Boolean] ( 判断是否是存在window对象 )

  • isIE [type Boolean] ( 判断是否是IE浏览器 )

  • isIE9 [type Boolean]

  • isEdge [type Boolean]

  • isAndroid [type Boolean]

  • isIOS [type Boolean]

  • isChrome [type Boolean]

  • isFF [type Boolean] ( 是否是火狐浏览器 )

  • isUndef [type Function => return Boolean] ( 判断是否是未定义 )

  • isDef [type Function => return Boolean] ( 判断是否是已定义 )

  • isTrue [type Function => return Boolean]

  • isFalse [type Function => return Boolean]

  • isObject [type Function => return Boolean] ( 判断是否为对象 如 Array Object Number String等js内部对象 )

  • isPlainObject [type Function => return Boolean] ( 判断是否是{}对象 如 )

isPlainObject({})
//=> true
  • isRegExp [type Function => return Boolean] ( 判断是否是正则对象 )

  • isPromise [type Function => return Boolean] ( 判断是否是Promise对象 )

  • toString [type Function => return String] ( 转为字符串 如 )

toString({a: 3}) 
//=> '{a: 3}' 
toString([3]) 
//=> '[3]' 
toString(3) 
//=> '3'
  • toNumber [type Function => return Number] ( 转为数字 )

  • toArray [type Function => return Number] ( 把字符串转为字符串数组 )

toArray('ass3434', 2)
//=> ['s', '3', '4', '3', '4']
  • extend [type Function => return Object] ( 合并属性到目标对象 )
extend(to, _from) // to 目标对象 _from 源对象 

extend({a: 2, b: 3}, {b: 4, c: 5})
//=> {a: 2, b: 4, c: 5}
  • toObject [type Function => return Object] ( 数组对象转为简单对象 )
toObject([{a:2, b: 3}, {c: 4}, {b: 5, e: 6}])
//=> {a:2, b: 5, c:4, e: 6}
  • identity [type Function] ( 返回同样值 )
identity(3)
//=> 3 
identity({}) 
//=> {} 
identity([3]) 
//=> [3]
  • no [type Function => return false] ( 返回false值 )

  • merge [type Function => return Object] ( 合并对象到目标对象 默认第一个参数为目标对象并返回对象 )

merge(obj2, obj3, obj4, ...)

merge({a: 2, b: 4}, {a: 3, c: 5}, {d: 5, e: 6})
//=> {a: 3, b: 4, c: 5, d: 5, e: 6}
  • randomn [type Function => return Number] ( 获取n位随机数,n小于22 )
randomn(5)
//=> 13560
randomn(21)
//=> 124406475752653050000
  • formatThousand [type Function => return String]( 数字金额千分位格式化 )
formatThousand(5435345.45)
//=> "5,435,345.45"
formatThousand(564565465.56456456)
//=> "564,565,465.5645646"

// 同样的,你也可以在vue框架中使用, 如下实例demo.

<template>
    <div>{{ number1 | formatThousand }}</div>
</template>

import { formatThousand } from 'front-uitls'
export default {
  data () {
    return {
      number1: 234234.3434
    }
  },
  filters: {
    formatThousand
  }
}

<style lang="less">
</style>
  • formatDate [type Function => return String]( 时间戳转为日期格式 )
formatDate(date, fmt) // date 时间戳(单位毫秒) fmt 日期格式 (默认值 'yyyy-MM-dd hh:mm')
formatDate(1355247273000)
//=> "2012-12-12 01:34"
formatDate(1355247273000, 'yyyy/MM/dd hh:mm')
//=> "2012/12/12 01:34"

// 同样的,你也可以在vue框架中使用, 如下实例demo.

<template>
    <div>{{ date1 | formatDate('yyyy/MM/dd') }}</div>
</template>

import { formatDate } from 'front-uitls'
export default {
  data () {
    return {
      date1: 1355247273000
    }
  },
  filters: {
    formatDate
  }
}

<style lang="less">
</style>
  • getType [type Function => return String]( 获取数据的类型描述 )
// 数值类型描述 => "number" "string" "array" "object" "null" "undefined"
getType(3)
//=> "number"
getType('adf')
//=> "string"
getType([{a: 3}, 3])
//=> "array"
getType({d: 4})
//=> "object"
getType(null)
//=> "null"
getType(undefined)
//=> "undefined"
  • clone [type Function(U) => return U]( 数据克隆 )
clone(3)
//=> 3
clone('test')
//=> "test"
clone({a: 3, b: 34})
//=> {a: 3, b: 34}
clone([343, 434])
//=> [343, 434]