纯 JS utils 库，适用前端任何场景
npm install any-utils --save访问嵌套对象，避免代码中出现类似 a && a.b ? a.b.c : null 的代码.
import { get } from 'any-utils';
const data = [{
id: 101,
email: 'jack@dev.com',
personalInfo: {
name: 'Jack',
address: {
line1: 'westwish st',
line2: 'washmasher',
city: [],
state: 'WX'
}
}
}];
// 获取 data[0].personalInfo.address.line1
get(data, [0, 'personalInfo', 'address', 'line1']); // westwish st
// 获取 data[0].personalInfo.address.line2 不存在的属性 wx
get(data, [0, 'personalInfo', 'address', 'line2', 'wx']); // undefined
// 取不到的情况先默认返回 undefined，也可以设置
get(data, [0, 'personalInfo', 'address', 'line2', 'wx'], '我是默认值'); // 我是默认值判断是不是空对象或者空数组
import { isEmpty } from 'any-utils';
// 判断空数组
isEmpty([]); // true
// 判断空对象
isEmpty({}); // true
// 判断非空对象
isEmpty({ a:1 }); // false
// 判断非空数组
isEmpty([1]); // false
// 判断非数组或对象
isEmpty(1); // false和 url 相关的方法
将类似 key1=18127873881&key2=2 格式的数据解析为 { key1: '18127873881', key2: 2 }
import { parseQuery, getQueryString } from 'any-utils';
// 解析 key1=18127873881&key2=2
parseQuery('key1=18127873881&key2=2') // { key1: '18127873881', key2: '2' }
// 解析空字符串
parseQuery('') // {}
// 获取 url 上面参数
// Location.href = https://www.baidu.com/s?ie=UTF-8
getQueryString('ie') // UTF-8
// 将 url 上面参数转换成对象
// Location.href = https://www.baidu.com/s?ie=UTF-8&name=allen
queryToObject() // { ie: 'UTF-8', name: 'allen'}判断数据类型
import { getTypeof, isString, isBoolean, isObject, isArray, isFunction, isDate, isJSON } from '../src/typeof';
// 判断是否为数组
getTypeof([1, 2])); // array
isArray([1, 2]); // true
isArray({}); // false
// 判断是否为字符串
getTypeof('我是字符串'); // string
isString('我是字符串'); // true
isString(false); // false
// 判断是否为对象
getTypeof({a: 2}); // object
isObject({a: 2}); // true
isObject(false); // false
// 判断 null 的类型
getTypeof(null); // null
// 判断是否为 boolean
getTypeof(false); // boolean
isBoolean(false); // true
isBoolean({a: 2}); // false
// 判断 number 类型
getTypeof(1); // number
// 判断 function
getTypeof(() => {}); // function
isFunction(() => {}); // true
isFunction(false); // false
// 判断 date
const date = new Date();
getTypeof(date); // date
isDate(date); // true
isDate(false); // false
// 判断是否是 JSON 字符串
isJSON('123'); // flase
isJSON('{}'); // true
isJSON('[1, 2, 3]'); // true
isJSON('{"a":1,"b":2}'); // true
isJSON(1); // falsedom 类方法
<div class="demo" id="demo" data-index="1"></div>import { isHTMLElement, hasClass, addClass, getDataByAttribute, bindEvent } from '../src/typeof';
const dom = document.getElementById('demo');
// 判断是否为 dom
isHTMLElement(dom, ); // true
// 判断元素是不是有某个 className
hasClass(dom, 'demo'); // true
// 给某个元素添加 className
addClass(dom, 'newClass'); // <div class="demo" id="demo newClass"></div>
// 在 Attribute 属性里面取 data- 开头的属性
getDataByAttribute(dom, 'index'); // 1
// 通用事件绑定函数 bindEvent(elem, type, selector, fn)
// 普通绑定
let dom = document.getElementById('custom-bg');
bindEvent(dom, 'click', function(event) {
console.log('我是普通绑定')
})
// 代理绑定
bindEvent(dom, 'click', '.selector', function(event) {
console.log('我只是绑定了 dom 下面 class 名称为 selector 的元素')
})深拷贝数组或对象
import { deepClone } from 'any-utils';
const source = {
age: 20,
name: 'allen',
address: {
city: 'shanxi',
},
arr: [1, 'a', ['c', 2, {a: 2}]],
};
const deepCloneObj = deepClone(source);
deepCloneObj.address.city = '南京';
const input = source.address.city;
const expectation = 'shanxi';
input === expectation // true缓存数据
import { createCache } from 'any-utils';
// 创建一个缓存容器
const c = createCache();
// 设置缓存数据
c.set('name', 'allen');
// 获取缓存数据
c.get('name');防抖
import { debounce } from 'any-utils';
// 事件处理函数，回掉函数支持传参
function handle(...values) {
console.log('-- do something --', values);
}
// 延时 1000ms
debounce(handle, 1000, this);节流
import { throttle } from 'any-utils';
// 事件处理函数，回掉函数支持传参
function handle(...values) {
console.log('-- do something --', values);
}
// 延时 1000ms
throttle(handle, 1000, this);解析 JSON 字符串
import { safeJSONParse } from 'any-utils';
// 解析 JSON 格式字符串
const objStr = '{"a":1,"b":2}';
safeJSONParse(objStr); // { a: 1, b: 2}
// 解析数组字符串
const arrStr = '[1, 2, "Jack"]';
safeJSONParse(arrStr); // [1, 2, "Jack"]
// 解析非 JSON 数据格式字符串
const str = 'abc';
// 解析失败默认返回 {}
safeJSONParse(str); // {}
// 也可以自定义返回值
safeJSONParse(str, '我是默认值'); // 我是默认值判断字符串或数组的包含关系，兼容不支持 includes 的场景
import { includes } from 'any-utils';
includes([1, 2, 3], 1) // true
includes(['2', '1', '3'], '1') // true
includes('我是字符串', '字符串') // true
includes('我是字符串', '其他') // false根据 url 是否包含 dev、test、pre、prod 判断是否为 dev、test、pre、prod 环境
import { fetchEnv } from 'any-utils';
fetchEnv('https://www.imooc.dev.com/') // dev
fetchEnv('https://www.imooc.test.com/') // test
fetchEnv('https://www.imooc.pre.com/') // pre
fetchEnv('https://www.imooc.prod.com/') // prod
// 支持直接读 window.location.href
fetchEnv() // 相当于 fetchEnv(window.location.href)根据 navigator.userAgent 判断当前系统类型
import { isIos, isChrome } from 'any-utils';
isIos() // 返回一个 boolean 值，是否为 isIos 系统
isChrome() // 返回一个 boolean 值，是否为谷歌浏览器判断两个对象是否相等
import { isEqual } from 'any-utils';
isEqual({ a: 1, b: {a: 1}}, {a: 1, b: {a: 1}}) // true
isEqual({ a: 1}, {a: 1, b: {a: 1}}) // false数组拍平
import { flat } from 'any-utils';
flat([1, 2, 3, [1, 2, [1, 2]]]) // [1,2,3,1,2,1,2]数组去重
import { unique } from 'any-utils';
unique([1, 2, 3, 3, 3, 3]) // [1,2,3]Build with TypeScript and tested by jest.
Checklist:
- 每个对外公开的函数必须经过单测
- 每个对外公开的函数必须在 README 添加文档
- npm version patch（向后兼容的 bug fix）/ minor （新需求且向后兼容） / major（不兼容）/ prerelease --preid=alpha(测试版本)
- npm publish
- git push && git push --tags
格式：:
- feat（feature，新功能，能够让用户觉察到的变化）
- fix（bug fix，修复 bug）
- docs（documentation，有关文档的更新，注释的更新）
- style（code formatting, missing semi colons, … 代码样式调整，对逻辑无影响，比如为符合 eslint 要求修改代码格式）
- refactor（重构，不影响或添加功能，比如文件、变量重命名、代码抽象为函数，消除魔法数字）
- test（when adding missing tests 写测试）
- chore（maintain 维护代码，比如构建脚本 webpack gulp、测试工具更新）
- perf （性能提升）
- ci（ci 脚本有关变更）
- temp（temp: 不计入 CHANGELOG。比如测试下真机上 transparent title 启动参数是否设置成功）