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

@xtdev/xt-utils

v1.0.9

Published

``` bash # install dependencies npm install

Downloads

5

Readme

项目启动:

# install dependencies
npm install

# 编译sdk命令
npm run build

快速使用:

第一种:
<script src="https://img.tanjiu.cn/frontsdk/1.0.8/xtUtils.js"></script>
console.log(window.xtUtils.urlQuery)
console.log(window.xtUtils.urlQuery.queryToObj)

第二种(当前最新版本:1.0.8):
npm install @xtdev/xt-utils -S

import { urlQuery } from '@xtdev/xt-utils'
console.log(urlQuery)
console.log(urlQuery.queryToObj)

方法:

方法名称: queryToObj

方法详细: 将url的传参参数形式的字符串转化为json对象格式
使用方式:
外链: const urlQuery = window.xtUtils.urlQuery
npm: import { urlQuery } from '@xtdev/xt-utils'
let param = 'school=gongda&hobby=skating&number=3'
let jsonObj = urlQuery.queryToObj(param)

console.log(jsonObj)
输出:{
        school: 'gongda',
        hobby: 'skaing',
        number: '3'
      }

方法名称: toQueryString

方法详细: 将obj转换成url参数形式
使用方式:
外链: const urlQuery = window.xtUtils.urlQuery
npm: import { urlQuery } from '@xtdev/xt-utils'
urlQuery.toQueryString({a:1,b:2})  =>   a=1&b=2

方法名称: urlToJson

方法详细: 直接取url中的参数转为json(或者不转)
使用方式:
外链: const urlQuery = window.xtUtils.urlQuery
npm: import { urlQuery } from '@xtdev/xt-utils'
用法1:
let para = urlQuery.urlToJson()
console.log(para)

用法2:
let para = urlQuery.urlToJson('https://www.baidu.com?a=1&b=2')
console.log(para)

方法名称: getQueryString

方法详细: 直接取url中的某个参数
使用方式:
外链: const urlQuery = window.xtUtils.urlQuery
npm: import { urlQuery } from '@xtdev/xt-utils'
用法:
let deviceType = urlQuery.getQueryString('deviceType')
console.log(deviceType)

方法名称: setUrl

方法详细: 更改url中的某个参数,返回更改后的最终带参数url
使用方式:
外链: const urlQuery = window.xtUtils.urlQuery
npm: import { urlQuery } from '@xtdev/xt-utils'
参数解析:
json: 更改参数的json对象
originUrl:预置的网站地址

用法一:
let resultUrl = urlQuery.setUrl({id: 1, name: '测试页面'})
console.log(resultUrl) // 输出:https://********.html?id=1&name=测试页面

用法二:
let resultUrl = urlQuery.setUrl({id: 3, name: '哈哈哈'}, 'https://www.baidu.com')
console.log(resultUrl) // 输出:https://www.baidu.com?id=3&name=哈哈哈

方法名称: isReg

方法详细: 校验正则方法
使用方式:
外链: const regRules = window.xtUtils.regRules
npm: import { regRules } from '@xtdev/xt-utils'
用法一:
let result = regRules.isReg(123, 'reg_number')
console.log(result) // 输出:true

用法二:
let result = regRules.isReg(123, regRules.regPool.reg_number)
console.log(result) // 输出:true

用法三:
let result = regRules.isReg(18501268102, /^1\d{10}$/)
console.log(result) // 输出:true

方法名称: regPool

方法详细: 目前提供的正则池子
使用方式:
外链: const regRules = window.xtUtils.regRules
npm: import { regRules } from '@xtdev/xt-utils'
const regPool = {
  reg_emailAddress:
    /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/, // 邮箱正则
  reg_space: /\s+/g, // 匹配所有空格
  reg_phoneNumber: /^1\d{10}$/, // 电话号码
  reg_url: /^http(s)?:\/\/.*$/, // 链接的正则,如:(http(s)://www.baidu.com)
  reg_number: /^[+-]?\d+(\.\d+|\.)?$/, // 数字正则(带有小数点)
  reg_number_nopoint: /^[0-9]*$/, // 数字正则(不带小数点)
  reg_word_cn: /^[\u4e00-\u9fa5]*$/, // 匹配中文汉字
  reg_word_eg: /^\w*$/, // 匹配英文字符及0-9,等价于“[A-Za-z0-9_]”
  reg_word_cn_eg: /^[\u4e00-\u9fa5|[A-Za-z]*$/, // 匹配中英文

  // 添加收货地址使用-----
  reg_name: /^[A-Za-z0-9|\u4e00-\u9fa5]*$/, // 匹配中英文不含空格(收货人)
  reg_address_info: /[\u4e00-\u9fa5]+/, // 匹配至少含有一个中文(地址详情)
  // -----

  reg_logistic: /^[A-Za-z0-9]+$/, // 纯数字+字母校验(物流单号)
  reg_special_word_en: /[`~!@#$%^&*()_+<>?:"{},.\/;'[\]]/im, // 英文特殊字符
  reg_special_word_cn: /[·!#¥(——):;“”‘、,|《。》?、【】[\]]/im, // 中文特殊字符

  reg_ID_card:
    /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/, // 身份证

  reg_tag: /<[^<>]+>/g, // html标签正则
  reg_tag_img: /<img.*?src="(.*?)".*?\/?>/gi, // 匹配出img标签
  reg_zip_code_v2: /^[1-9]\d{5}/, // 邮编正则

  reg_telephone_v1: /^[0-9]{0,4}$/, // 座机-区号-4位
  reg_telephone_v2: /^[0-9]{7,11}$/, // 座机-号码-7-11位
  reg_telephone_v3: /^[0-9]{0,6}$/, // 座机-分机号-最多6位
}

用法一:
let result = regRules.regPool.reg_number
console.log(result) // 输出:/^[+-]?\d+(\.\d+|\.)?$/

方法名称: deepClone

方法详细: 对象、数组深拷贝
使用方式:
外链: const deepClone = window.xtUtils.deepClone
npm: import { deepClone } from '@xtdev/xt-utils'
用法一:
let result = deepClone({a: 1, b: 2})
console.log(result) // 深拷贝,输出:{a: 1, b: 2}

方法名称: isClass

方法详细: 返回当前数据类型(返回:array、object、number、string)
使用方式:
外链: const base = window.xtUtils.base
npm: import { base } from '@xtdev/xt-utils'
用法一:
let result = base.isClass({a: 1, b: 2})
console.log(result) // 打印数据类型,输出: 'object'

方法名称: enCodeData

方法详细: 字符串数据加密算法,双向-对应deCodeData方法;(***注:对同一字符串加密:得到的加密字符串每次都不一致。)
使用方式:
外链: const crypto = window.xtUtils.crypto
npm: import { crypto } from '@xtdev/xt-utils'
1. crypto.enCodeData('测试一下') // 输出加密后字符串:U2FsdGVkX1/GJ7iQZAYKp1IgSGdvopC86jz5jTnhUSI=
2. crypto.enCodeData({
      a: 1,
      b: 3,
    })
3. crypto.enCodeData([1,2,3,4,5])

方法名称: deCodeData

方法详细: 字符串数据解密算法,传入参数必须是上面'enCodeData'方法加密后的字符串
使用方式:
外链: const crypto = window.xtUtils.crypto
npm: import { crypto } from '@xtdev/xt-utils'
crypto.deCodeData('U2FsdGVkX1/GJ7iQZAYKp1IgSGdvopC86jz5jTnhUSI=') // 输出解密后字符串:测试一下

方法名称: md5

方法详细: 字符串md5加密算法,单向;(***注:对同一字符串加密:得到的加密字符串永远一致。)
使用方式:
外链: const crypto = window.xtUtils.crypto
npm: import { crypto } from '@xtdev/xt-utils'
md5('测试一下') // 输出加密后字符串:U2FsdGVkX1/GJ7iQZAYKp1IgSGdvopC86jz5jTnhUSI=

方法名称: loadCss

方法详细: 自定义动态加载css方法(支持传入对象、数组),串行依次按顺序加载数组中的css资源
使用方式:
外链: const loadCss = window.xtUtils.loadCss
npm: import { loadCss } from '@xtdev/xt-utils'
// 用法1: 资源串行加载
loadCss(
  [
    {
      global: "cssA", // 必须传入,避免spa单页面重复加载css,加载成功后,会将值注入到window上
      src: "https://dss0.bdstatic.com/5aV1bjqh_Q23odCf/static/mantpl/css/recommand/init-304003f32f.css",
    },
    {
      global: "cssB",
      src: "https://dss0.bdstatic.com/5aV1bjqh_Q23odCf/static/newmusic/css/newmusic_min_1b1ebf56.css",
    },
  ], function () {
    console.log('静态资源已经全部加载完毕');
  }
);

// 用法2: 资源并行加载,增加第三个参数传2
loadCss(
  [
    {
      global: "cssA", // 必须传入,避免spa单页面重复加载css,加载成功后,会将值注入到window上
      src: "https://dss0.bdstatic.com/5aV1bjqh_Q23odCf/static/mantpl/css/recommand/init-304003f32f.css",
    },
    {
      global: "cssB",
      src: "https://dss0.bdstatic.com/5aV1bjqh_Q23odCf/static/newmusic/css/newmusic_min_1b1ebf56.css",
    },
  ], function () {
    console.log('静态资源已经全部加载完毕');
  },
  2
);

方法名称: loadJs

方法详细: 自定义动态加载js方法(支持传入对象、数组),串行依次按顺序加载数组中的js资源
使用方式:
外链: const loadJs = window.xtUtils.loadJs
npm: import { loadJs } from '@xtdev/xt-utils'
// 用法1: 资源串行加载
loadJs(
  [
    {
      global: "Bscroll", // 必须传入,避免spa单页面重复加载js,加载成功后,会将值注入到window上
      src: "https://mstatic.secooimg.com/js/bscroll.min.js",
    },
    {
      global: "jQuery",
      src: "https://dss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/js/lib/jquery-1-edb203c114.10.2.js",
    },
  ], function () {
    console.log('静态资源已经全部加载完毕');
  }
);

// 用法2: 资源并行加载,增加第三个参数传2
loadJs(
  [
    {
      global: "Bscroll", // 必须传入,避免spa单页面重复加载js,加载成功后,会将值注入到window上
      src: "https://mstatic.secooimg.com/js/bscroll.min.js",
    },
    {
      global: "jQuery",
      src: "https://dss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/js/lib/jquery-1-edb203c114.10.2.js",
    },
  ], function () {
    console.log('静态资源已经全部加载完毕');
  },
  2
);

方法名称: myBrowser

方法详细: 判断当前浏览器类型(返回:Opera、FF、Chrome、Safari、IE、ipad)
使用方式:
外链: const navigate = window.xtUtils.navigate
npm: import { navigate } from '@xtdev/xt-utils'
navigate.myBrowser() // Chrome

方法名称: isPc

方法详细: 判断是否是pc端
使用方式:
外链: const navigate = window.xtUtils.navigate
npm: import { navigate } from '@xtdev/xt-utils'
navigate.isPc() // true

方法名称: isH5

方法详细: 判断是否是h5端
使用方式:
外链: const navigate = window.xtUtils.navigate
npm: import { navigate } from '@xtdev/xt-utils'
navigate.isH5() // true

方法名称: isIpad

方法详细: 判断是否是ipad端
使用方式:
外链: const navigate = window.xtUtils.navigate
npm: import { navigate } from '@xtdev/xt-utils'
navigate.isIpad() // true

方法名称: isIpod

方法详细: 判断是否是ipod端
使用方式:
外链: const navigate = window.xtUtils.navigate
npm: import { navigate } from '@xtdev/xt-utils'
navigate.isIpod() // true

方法名称: isWx

方法详细: 判断是否在微信中打开(微信环境)
使用方式:
外链: const navigate = window.xtUtils.navigate
npm: import { navigate } from '@xtdev/xt-utils'
navigate.isWx() // true

方法名称: isWxMini

方法详细: 判断是否是微信小程序打开
使用方式:
外链: const navigate = window.xtUtils.navigate
npm: import { navigate } from '@xtdev/xt-utils'
navigate.isWxMini() // true

方法名称: systemType

方法详细: 判断当前浏览器是什么系统(mac、windows32、windows64、其他)
使用方式:
外链: const navigate = window.xtUtils.navigate
npm: import { navigate } from '@xtdev/xt-utils'
navigate.systemType() // 输出: 'mac'

方法名称: imgZoomAuto

方法详细: 等比例缩放图片函数
使用方式:
外链: const base = window.xtUtils.base
npm: import { base } from '@xtdev/xt-utils'
const newData = base.imgZoomAuto({
  oldWidth: 100,
  oldHeight: 200,
  newHeight: 300,
});
console.log(newData)
/*
输出:
{
  newHeight: 300,
  newWidth: 150,
  oldHeight: 200,
  oldWidth: 100
}
*/

方法名称: loadImage

方法详细: 加载img,完成后执行then后的逻辑
使用方式:
外链: const base = window.xtUtils.base
npm: import { base } from '@xtdev/xt-utils'
let imgUrl = "https://tpdoc.cn/erp/uploads/image/cut_133301_3487.png";
base.loadImage(imgUrl).then((url) => {
  console.log(url);
});

方法名称: getRandom

方法详细: 得到一个数组,内部数字随机且不重复(length:数组长度;range:随机范围)
使用方式:
外链: const base = window.xtUtils.base
npm: import { base } from '@xtdev/xt-utils'
const newData = base.getRandom(9);
console.log(newData) // 打印:0-9之间的随机整数(不包含9)

方法名称: getNorepeatArr

方法详细: 取0-n之间的随机整数
使用方式:
外链: const base = window.xtUtils.base
npm: import { base } from '@xtdev/xt-utils'
const newData = base.getNorepeatArr(3, 9)
console.log(newData) // 打印:0-9之间的随机整数(不包含9) 的 包含3项的数组

方法名称: wordLen

方法详细: 字符串按照不同字符规则标准,返回当前字符串长度;
wordLen(word, type) (word参数:字符串;第二个参数type:1是按照当前字符串长度返回, 2:是按照字符数的长度返回[一个汉字长度是2个字符], 3:是按照汉字数的长度返回[一个字符长度是0.5个汉字])
使用方式:
外链: const base = window.xtUtils.base
npm: import { base } from '@xtdev/xt-utils'
const word = '哈哈哈123'
var index1 = base.wordLen(word, 1)
var index2 = base.wordLen(word, 2)
var index3 = base.wordLen(word, 3)
console.log(index1) // 输出:6
console.log(index2) // 输出:9
console.log(index3) // 输出:4.5

方法名称: goBack

方法详细: 浏览器返回上一页
使用方式:
外链: const base = window.xtUtils.base
npm: import { base } from '@xtdev/xt-utils'
// 用法一:
base.goBack(true) // 暂存上一页的input值

// 用法二:
base.goBack(false) // 不暂存上一页的input值,全部刷新;默认是false

方法名称: setStorage

方法详细: 设置本地存储
使用方式:
外链: const storage = window.xtUtils.storage
npm: import { storage } from '@xtdev/xt-utils'
// 用法一:
storage.setStorage('20191111_game_v1', '哈哈哈123')

// 用法二:
storage.setStorage('20191111_game_v1', {a:1, b:2})

方法名称: removeStorage

方法详细: 删除本地存储
使用方式:
外链: const storage = window.xtUtils.storage
npm: import { storage } from '@xtdev/xt-utils'
storage.removeStorage('20191111_game_v1')

方法名称: getStorage

方法详细: 获取本地存储
使用方式:
外链: const storage = window.xtUtils.storage
npm: import { storage } from '@xtdev/xt-utils'
// 用法一:
let data = storage.getStorage('20191111_game_v1')
console.log(data)

// 用法二(数据是object时,可传第二个参数制定返回的属性):
let data = storage.getStorage('20191111_game_v1', 'deviceId')
console.log(data)

方法名称: setCookie

方法详细: 设置cookie
使用方式:
外链: const cookie = window.xtUtils.cookie
npm: import { cookie } from '@xtdev/xt-utils'
用法一:
cookie.setCookie('topay_cli_manage_name', '123')

用法二:
var in15Minutes = new Date(new Date().getTime() + 15 * 60 * 1000);
cookie.setCookie('topay_cli_manage_name', '123', {
  path: '/about',
  expires: in15Minutes, // 过期时间(毫秒)
})

方法名称: removeCookie

方法详细: 删除cookie
使用方式:
外链: const cookie = window.xtUtils.cookie
npm: import { cookie } from '@xtdev/xt-utils'
用法一:
cookie.removeCookie('topay_cli_manage_name')

用法二:
cookie.removeCookie('topay_cli_manage_name', {
  path: '/about',
})

方法名称: getCookie

方法详细: 获取cookie
使用方式:
外链: const cookie = window.xtUtils.cookie
npm: import { cookie } from '@xtdev/xt-utils'
用法一:
cookie.getCookie('cookieName')

用法二:
cookie.getCookie('cookieName', {
  path: '/about',
})

方法名称: getRandomString

方法详细: 产生随机字符串
example : getRandomString() => '27wx-9AkP-MPYj-ERfx'
example : getRandomString('dddd-dddd-dddd') => '5238-3191-0062'
example : getRandomString('sss_sss_sss') => 'TDP_pQR_xWQ'
example : getRandomString('@.com') => '[email protected]'
使用方式:
外链: const strTools = window.xtUtils.strTools
npm: import { strTools } from '@xtdev/xt-utils'
用法一: strTools.getRandomString() => '27wx-9AkP-MPYj-ERfx'
用法二: strTools.getRandomString('dddd-dddd-dddd') => '5238-3191-0062'
用法三: strTools.getRandomString('sss_sss_sss') => 'TDP_pQR_xWQ'
用法四: strTools.getRandomString('****@****.com') => '[email protected]'

方法名称: desensitization

方法详细: 电话号码/身份证 脱敏。有3个参数,具体使用如下:
使用方式:
外链: const strTools = window.xtUtils.strTools
npm: import { strTools } from '@xtdev/xt-utils'
用法一: strTools.desensitization(18501268102, 6,7) => ''185012**8102''