1.0.2 • Published 6 years ago
mem-utils v1.0.2
util
实用方法汇总
工具函数都为es5写法,适用于兼容es5的浏览器。
1.parseUrl方法
传入一个url,分析此url的信息,并输出一个完整的对象,包括域名、参数、哈希值等属性
例如:
parseUrl('http://xjzheng.cn/memory/doc/index.html?name=xu&id=333#go');
// 返回值为:
{
"params": {
"name": "xu",
"id": "333"
},
"protocol": "http:",
"host": "xjzheng.cn",
"hostname": "xjzheng.cn",
"origin": "http://xjzheng.cn",
"username": "",
"password": "",
"pathname": "/memory/doc/index.html",
"port": "",
"search": "?name=xu&id=333",
"hash": "#go"
}
2. htturl属性
此属性则为当前url的parseUrl生成的对象。
3. cookie方法
cookie操作方法,进行cookie的查找、添加、删除等操作。 调用: cookie(name, value, options);
使用方法如下:
cookie('user'); // 获取cookie user的值
cookie('user', 'memory') // 存储cookie user值为memory
cookie('user', null) // 删除cookie user
cookie('user', 'memory', {
path: '/',
domian: 'xjzheng.cn',
expires: 5, // 有效期5天
}); // 存储cookie user,并修改额外的属性
4. storage方法
webStorge操作函数,有sessionStorage和localStorage两种操作类型。 调用:storage(type).get(key);
var storageHandler = storage('session');
storageHandler.set('user', 'memory'); // 存储session user值为memory
storageHandler.get('user') // 获取session user
var lStorage = storage('local');
lStorage.set('user', 'memory', 2); // 存储local,第三个参数可选,为有效期多少天;
lStorage.remove('user'); // 删除storage user
5. countDown方法
倒计时函数,接收一个截止日期和一个倒计时触发函数,每一次倒计时更新都触发该函数。 调用: countDown(endTime, handlerFunction);
countDown(new Date(Date.now() + 3600 * 24 * 2), function(data) {
var hh = data.hh;
var mm = data.mm;
var ss = data.ss;
var ms = data.ms;
// 将当前时间渲染到页面
});
6. formatTimeJson方法
countDown的子方法,此方法接收一个毫秒数值, fan hu返回一个当前日期数据对象。
formatTimeJson(60000); // 1分钟
// 返回
{
yyyy: 0,
MM: 0,
dd: 0,
hh: 0,
mm: 1,
ss: 0,
ms: 0
};
7. formatDate方法
接收一个日期对象,返回一个格式化的日期字符串; 调用:formatDate(date, onlyDate);
formatDate(new Date()); // 2018-4-4 09:30:08
formatDate(new Date(), true); // 2018-4-4
8. extend方法
拷贝方法,可以将对象的属性继承到目标对象上。 调用:extend([deep, target, options1, options2, ...);
var obj1 = {
a: 11,
b: {
cc: 22
}
};
var obj2 = {
a: 14,
b: {
d: 66
}
};
extend(obj1, obj2); // 将obj2继承到obj1上,实际上是一级属性的赋值
extend(true, obj1, obj2); // 将obj2继承到obj1上,并且深度拷贝,为逐级继承。
9. EventBus构造函数
处理事件的订阅发布的构造函数 调用:new EventBus();
var evt = new EventBus();
// 订阅test事件,处理函数为第二个参数,处理函数上下文为第三个参数
evt.on('test', (ag1, ag2) => {
console.log(ag1 + ag2);
}, this);
// 触发test事件,并传参
evt.emit('test', 'hello', 'world');
10. lockHandler函数
函数上锁,在特定的情况解锁,锁定状态下不能再次执行 调用:lockHandler(cb, context);
// 回调函数最后一个参数是一个解锁的函数,在特定场景解锁
document.onclick = lockHandler(function (evt, unlock) {
setTimeout(() => {
// 做一些事情;
unlock();
}, 2000);
});
10. scrollAnimation函数
scrollTop滚动动画,在一定时间内滚动到一定的scrollTop 调用:scrollAnimation(scrollTop, runtime);
// 300毫秒scrollTop变更到500
scrollAnimation(500, 300);