JavaScript工具类:util.js用法实例

缓存方法


_util.cookie.set()
_util.cookie.set('user_name', 'guang');         // 关闭浏览器后失效。注:单独打开 demo.html 是没法缓存的,需要启动本地服务
_util.cookie.set('user_id', '12', 1);           // 保存一天
_util.cookie.set('user_type', 'admin', 1/24);   // 保存一个小时
_util.cookie.set('is_login', '1', 1/24/60);     // 保存一分钟
_util.cookie.get()
console.log(_util.cookie.get('user_name'));     // guang
console.log(_util.cookie.get('user_id'));       // 12
console.log(_util.cookie.get('user_type'));     // admin
console.log(_util.cookie.get('is_login'));      // '1'
_util.cookie.remove()
_util.cookie.remove('user_name');
_util.cookie.remove('user_id');
_util.cookie.remove('user_type');
_util.cookie.remove('is_login');

本地储存方法


_util.storage.set()
_util.storage.set('user', { name: 'guang', age: '25'}); // 'obj-{"name":"guang","age":"25"}'
_util.storage.set('lang', 'zh-cn');                     // 'zh-cn'
_util.storage.get()
console.log(_util.storage.get('user'));     // { name: 'guang', age: '25'}
console.log(_util.storage.get('lang'));     // 'zh-cn'
_util.storage.remove()
_util.storage.remove('user');	// 删除 user 及对应的值
_util.storage.clear()
_util.storage.clear();	// 清空所有 localStorage

数据类型通用方法


_util.isEmpty()
console.log(_util.isEmpty(undefined));  // true
console.log(_util.isEmpty(null));   // true
console.log(_util.isEmpty(''));     // true
console.log(_util.isEmpty([]));     // true
console.log(_util.isEmpty({}));     // true
_util.isString()
console.log(_util.isString('q'));  // true
_util.isArray()
console.log(_util.isArray('q'));    // false
console.log(_util.isArray(['q']));  // true
_util.isObject()
console.log(_util.isObject('q'));       // false
console.log(_util.isObject(['q']));     // false
console.log(_util.isObject({id:'q'}));  // true
_util.isFunction()
var fn = function(){};

console.log(_util.isFunction(fn));  // true
_util.length()
var obj = {
    id: 'a',
    status: '0'
};
var arr = ['p','o','i'];
var str = 'yeah';

console.log(_util.length(obj));     // 2
console.log(_util.length(arr));     // 3
console.log(_util.length(str));     // 4
_util.forEach()
var source = [
    { id: 'c', status: '3', count: '46' },
    { id: 'd', status: '1', count: '41' }
];
_util.forEach(source, function(i, item){
    console.log(i);
    console.log(item);  
    // 0
    // { id: 'c', status: '3', count: '46' }
    // 1
    // { id: 'd', status: '1', count: '41' }
});

var source = {
    id: 'c',
    status: '3'
};
_util.forEach(source, function(key, value){
    console.log(key);
    console.log(value);  
    // 'id'
    // 'c'
    // 'status'
    // '3'
});
_util.isEqual()
var source1 = [
    'qw',
    ['q','w'],
    { id: 'a', status: '2', count: '19' },
];
var source2 = [
    'qw',
    ['q','w'],
    { id: 'a', status: '2', count: '19' },
];
var source3 = [
    'qw',
    ['q','w'],
    { id: 'b', status: '2', count: '19' },
];

console.log(_util.isEqual(source1, source2));     // true
console.log(_util.isEqual(source1, source3));     // false
_util.copy()
var s1 = { id: 'a' };
var s2 = s1;
s2.status = '2';
console.log(s1);    // {id: "a", status: "2"}

var s1 = { id: 'a' };
var s2 = _util.copy(s1);
s2.status = '2';
console.log(_util.copy(s1));    // {id: "a"}

var s1 = [{ id: 'a' }];
var s2 = s1;
s2.push({ id: 'b' });
console.log(_util.copy(s1));    // [{id: "a"}, {id: "b"}]

var s1 = [{ id: 'a' }];
var s2 = _util.copy(s1);
s2.push({ id: 'b' });
console.log(_util.copy(s1));    // [{id: "a"}]

字符串方法


_util.trim()
var str = '  qwe  rty ';

console.log(_util.trim(str));       // 'qwe  rty'
_util.trimAll()
var str = '  qwe  rty ';

console.log(_util.trimAll(str));    // 'qwerty'
_util.string.format()
var str = '确定要{0}单据【{1}】吗?';

console.log(_util.string.format(str, '删除', 'QZYDYJZB201901300002'));   // '确定要删除单据【QZYDYJZB201901300002】吗?'
_util.string.isStartWith()
var str = 'qwerty';
var startStr = 'qw';

console.log(_util.string.isStartWith(str, startStr'));   // true
_util.string.isEndWith()
var str = 'qwerty';
var endStr = 'ty';

console.log(_util.string.isEndWith(str, endStr));   // true
_util.string.firstUpperCase()
var str = 'qwerty';

console.log(_util.string.firstUpperCase(str));   // 'Qwerty'
_util.string.reverse()
var str = 'qwerty';

console.log(_util.string.reverse(str));   // 'ytrewq'
_util.string.split()
var str = 'a,s,d';

console.log(_util.string.split(str, ','));   // ["a", "s", "d"]
_util.string.getNext()
console.log(_util.string.getNext('0001'));     // '0002'
console.log(_util.string.getNext('XM0001'));   // 'XM0002'

数字方法


_util.number.parseInt()
console.log(_util.number.parseInt('25.36'));   // 25
_util.number.parseFloat()
console.log(_util.number.parseFloat('25.36'));   // 25.36
_util.number.toFixed()
console.log(_util.number.toFixed('25.3682', 2));   // '25.37'
_util.number.round()
console.log(_util.number.round('25.3682', 2));   // 25.37
_util.number.ceil()
console.log(_util.number.ceil('25.3612', 2));   // 25.37
_util.number.floor()
console.log(_util.number.floor('25.3682', 2));   // 25.36
_util.number.mul()
var n1 = 1.2;
var n2 = 2.3;
var n3 = 3.45;

console.log(_util.number.mul(n1, n2 ,n3));   // 9.522
_util.number.add()
var n1 = 1.2;
var n2 = 2.3;
var n3 = 3.45;

console.log(_util.number.add(n1, n2 ,n3));   // 6.95
_util.number.random()
console.log(_util.number.random(1, 100));   // 55

数组方法


_util.array.indexOf()
var arr = [
    'qwert',
    ['q', 'w', 'e'],
    { id: 'a', name: '光' }
];

console.log(_util.array.indexOf(arr, 'qwert'));         // 0
console.log(_util.array.indexOf(arr, ['q', 'w', 'e'])); // 1
console.log(_util.array.indexOf(arr, {id: 'a'}));       // 2。当检索数组中的对象时,只用匹配该对象的某一个(几个)属性即可查询到。
_util.array.push()
var arr = ['q'];
var len = _util.array.push(arr, ['w','e']);

console.log(arr);   // ["q", "w", "e"]
console.log(len);   // 4
_util.array.sort()
var arr = [
    { billNo: 'CGAPD20190301000002', date: '2019-03-01', count: '22' },
    { billNo: 'CGAPD20190228000001', date: '2019-02-28', count: '14' },
    { billNo: 'CGAPD20190301000001', date: '2019-03-01', count: '36' },
];

console.log(_util.array.sort(arr, 'billNo'));   // 输出结果为:  
// [
//    { billNo: 'CGAPD20190228000001', date: '2019-02-28', count: '14' },
//    { billNo: 'CGAPD20190301000001', date: '2019-03-01', count: '36' },
//    { billNo: 'CGAPD20190301000002', date: '2019-03-01', count: '22' },
// ];
_util.array.unique()
var arr = [
    'qw',
    'qw',
    ['q','w'],
    ['w','q'],
    { id: 'a', status: '1', count: '22' },
    { id: 'a', status: '2', count: '19' },
];

console.log(_util.array.unique(arr));   // 输出结果为:
// [
//     'qw',
//     ['q','w'],
//     ['w','q'],
//     { id: 'a', status: '1', count: '22' },
//     { id: 'a', status: '2', count: '19' },
// ]

console.log(_util.array.unique(arr, 'id')); // 输出结果为:
// [
//     'qw',
//     ['q','w'],
//     ['w','q'],
//     { id: 'a', status: '1', count: '22' },
// ]

console.log(_util.array.unique(arr, 'id', true));   // 输出结果为:
// [
//     'qw',
//     ['q','w'],
//     { id: 'a', status: '1', count: '22' },
// ]
_util.array.filter()
arr = [
    { id: 'a', status: '1', count: '22' },
    { id: 'b', status: '2', count: '19' },
    { id: 'c', status: '3', count: '46' },
    { id: 'd', status: '1', count: '41' },
];

console.log(_util.array.filter(arr, { status: '1'}));   // 输出结果为:
// [
//     { id: 'a', status: '1', count: '22' },
//     { id: 'd', status: '1', count: '41' }
// ]

console.log(_util.array.filter(arr, { status: '1', id: 'a'}));      // 输出结果为:
// [
//     { id: 'a', status: '1', count: '22' }
// ]

console.log(_util.array.filter(arr, { status: ['1', '2']}));        // 输出结果为:
// [
//     { id: 'a', status: '1', count: '22' },
//     { id: 'b', status: '2', count: '19' },
//     { id: 'd', status: '1', count: '41' }
// ]

console.log(_util.array.filter(arr, { status: ['1', '2']}, true));  // 输出结果为:
// [
//     { id: 'c', status: '3', count: '46' },
// ]
_util.array.select()
var arr = [
    { id: 'a', status: '1', count: '22' },
    { id: 'b', status: '2', count: '19' },
    { id: 'c', status: '3', count: '46' },
];

console.log(_util.array.select(arr, 'count'));    // ["22", "19", "46"]
console.log(_util.array.select(arr, ['status', 'count']));    // 输出结果为:
// [
//     { status: '1', count: '22' },
//     { status: '2', count: '19' },
//     { status: '3', count: '46' }
// ]
_util.array.concat()
var arr1 = ['q','w'];
var arr2 = ['q','a'];

console.log(_util.array.concat(arr1, arr2));    // ["q", "w", "a"]
_util.array.group()
var arr = [
    { size: 'S', color: '红色', price: '199' },
    { size: 'M', color: '蓝色', price: '299' },
    { size: 'M', color: '黄色', price: '159' },
    { size: 'S', color: '绿色', price: '168' },
];

console.log(_util.array.group(arr, 'size'));    // 输出结果为:
// [
//     {
//         "size":"S",
//         "group":[
//             {
//                 "size":"S",
//                 "color":"红色",
//                 "price":"199"
//             },
//             {
//                 "size":"S",
//                 "color":"绿色",
//                 "price":"168"
//             }
//         ]
//     },
//     {
//         "size":"M",
//         "group":[
//             {
//                 "size":"M",
//                 "color":"蓝色",
//                 "price":"299"
//             },
//             {
//                 "size":"M",
//                 "color":"黄色",
//                 "price":"159"
//             }
//         ]
//     }
// ]
_util.array.remove()
var arr = ['s', 'g', '', null, undefined, { id:'q', status: '1'} ];

_util.array.remove(arr);
console.log(arr);   // ["s", "g", { id:'q', status: '1'}]

_util.array.remove(arr, ['s', { id:'q' }]);
console.log(arr);   // ["g"]
_util.array.clear()
var arr = ['s', 'h', 'i'];
_util.array.clear(arr);

console.log(arr);   // []

对象方法


_util.object.keys()
var obj = {
    name: 'guang',
    age: '25'
};

console.log(_util.object.keys(obj));    // ["name", "age"]
_util.object.values()
var obj = {
    name: 'guang',
    age: '25'
}

console.log(_util.object.values(obj));  // ["guang", "25"]
_util.object.assign()
var obj2 = {
    type: 'admin',
    age: '26'
};
_util.object.assign(obj, obj2);

console.log(obj);   // { name: "guang", age: "26", type: "admin" }
_util.object.select()
var obj = {
    name: 'guang',
    email: '123456@qq.com',
    phone: '13566668888'
};

console.log(_util.object.select(obj, ['name', 'phone'])); // {name: "guang", phone: "13566668888"}
_util.object.remove()
var obj = {
    name: 'guang',
    email: '123456@qq.com',
    phone: '13566668888',
    wrong: '',
    wrong2: undefined,
};

console.log(_util.object.remove(obj)); // {name: "guang", email: "123456@qq.com", phone: "13566668888"}
console.log(_util.object.remove(obj, ['name', 'phone'])); // {email: "123456@qq.com"}
_util.object.getValue()
var obj = {
    name: 'guang',
    child: {
        name: 'lan'
    }
};

console.log(_util.object.getValue(obj, 'child.name'));  // lan
_util.object.serialize()
var obj = {
    id: 'a',
    billNo: 'CGDD20190228000001'
};

console.log(_util.object.serialize(obj));   // id=a&billNo=CGDD20190228000001
_util.object.clear()
var obj = {
    id: 'a',
    billNo: 'CGDD20190228000001'
};
_util.object.clear(obj);

console.log(obj);  // {id: "", billNo: ""}

json数据方法


_util.json.toTreeData()
var data = [
    { "id": "1", "level": "1", "name": "基础平台", "parentId": null },
    { "id": "2", "level": "1", "name": "财务平台", "parentId": null },
    { "id": "101", "level": "2", "name": "设置", "parentId": "1" },
    { "id": "102", "level": "2", "name": "系统", "parentId": "1" },
    { "id": "10101", "level": "3", "name": "参数设置", "parentId": "101" },
    { "id": "10201", "level": "3", "name": "权限设置", "parentId": "102" }
];

console.log(_util.json.toTreeData(data, 'id', 'parentId', 'children')); // 输出结果为:
// [
//     {
//         "id":"1",
//         "level":"1",
//         "name":"基础平台",
//         "parentId":null,
//         "children":[
//             {
//                 "id":"101",
//                 "level":"2",
//                 "name":"设置",
//                 "parentId":"1",
//                 "children":[
//                     {
//                         "id":"10101",
//                         "level":"3",
//                         "name":"参数设置",
//                         "parentId":"101"
//                     }
//                 ]
//             },
//             {
//                 "id":"102",
//                 "level":"2",
//                 "name":"系统",
//                 "parentId":"1",
//                 "children":[
//                     {
//                         "id":"10201",
//                         "level":"3",
//                         "name":"权限设置",
//                         "parentId":"102"
//                     }
//                 ]
//             }
//         ]
//     },
//     {
//         "id":"2",
//         "level":"1",
//         "name":"财务平台",
//         "parentId":null
//     }
// ]

时间方法


_util.date.format()
console.log(_util.date.format());
console.log(_util.date.format('', 'YYYY月MM年DD日'));
console.log(_util.date.format('', 'YYYY-MM-DD hh:mm:ss 星期WW'));
_util.date.otherMonth()
console.log(_util.date.otherMonth(-1, '2019-03-04'));	// 2019-02-04
console.log(_util.date.otherMonth(1, '2019-03-04'));	// 2019-04-04
_util.date.startOfMonth()
console.log(_util.date.startOfMonth(0, '2019-03-04'));	// '2019-03-01'
console.log(_util.date.startOfMonth(-1, '2019-03-04'));	// '2019-02-01'
_util.date.endOfMonth()
console.log(_util.date.endOfMonth(0, '2019-03-04'));	// '2019-03-31'
console.log(_util.date.endOfMonth(-1, '2019-03-04'));	// '2019-02-28'
_util.date.startOfWeek()
console.log(_util.date.startOfWeek(0, '2019-03-04'));		// '2019-03-04'
_util.date.endOfWeek()
console.log(_util.date.endOfWeek(0, '2019-03-04'));		// '2019-03-10'
_util.date.otherDate()
console.log(_util.date.otherDate(-6, '2019-03-04'));	// '2019-02-26'
_util.date.howManyDays()
console.log(_util.date.howManyDays('2019-01-12', '2019-02-01'));    // 20
_util.date.howManyMonths()
console.log(_util.date.howManyMonths('2019-01', '2018-05'));    // 8
_util.date.getDatesBetween()
console.log(_util.date.getDatesBetween('2019-01-25', '2019-02-01'));    // ["2019-01-25", "2019-01-26", "2019-01-27", "2019-01-28", "2019-01-29", "2019-01-30", "2019-01-31", "2019-02-01"]
console.log(_util.date.getDatesBetween('2019-01-25', '2019-02-01', 'YYYY-MM')); // ["2019-01", "2019-02"]

浏览器判断方法


_util.browser.type()
console.log(_util.browser.type());
_util.browser.isChrome()
console.log(_util.browser.isChrome());
_util.browser.isIE()
console.log(_util.browser.isIE());
_util.browser.isEdge()
console.log(_util.browser.isEdge());
_util.browser.isSafari()
console.log(_util.browser.isSafari());
_util.browser.isFirefox()
console.log(_util.browser.isFirefox());
_util.browser.isWechat()
console.log(_util.browser.isWechat());
_util.browser.isAndroid()
console.log(_util.browser.isAndroid());
_util.browser.isIOS()
console.log(_util.browser.isIOS());
_util.browser.isMobile()
console.log(_util.browser.isMobile());

表单验证方法


_util.validate.positiveToFixed()
var input = '12.345';

console.log(_util.validate.positiveToFixed(input, 2));  // false
console.log(_util.validate.positiveToFixed(input, 3));  // true
注:其他方法直接调用即可

下载

npm i sg-utils -S

GitHub地址(记得给星哦)

https://github.com/shiguang0116/sg-utils


系列文章

JavaScript工具类(一):util.js创建及上传
JavaScript工具类(二):cookie缓存
JavaScript工具类(三):localStorage本地储存
JavaScript工具类(四):数据类型
JavaScript工具类(五):string字符串
JavaScript工具类(六):number数字
JavaScript工具类(七):array数组
JavaScript工具类(八):object对象
JavaScript工具类(九):date日期
JavaScript工具类(十):base64编码、解码
JavaScript工具类(十一):浏览器、移动端类型
JavaScript工具类(十二):validate表单验证
JavaScript工具类(十三):url路径处理
JavaScript工具类(十四):json数据格式
JavaScript工具类:util.js用法实例


  • 8
    点赞
  • 16
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值