colin-util
v1.0.3
Published
工具包分别已压缩或者分包. 可支持全引入和按需引入两种方式
Downloads
7
Readme
工具库函数开发
工具包分别已压缩或者分包. 可支持全引入和按需引入两种方式
import { debounce, throttle } from "colin-util"; //全引入
import deepClone from "colin-util/dist"; //按需引入
// debounce用法
debounce(() => {
console.log('fn 防抖执行了')
}, 1000)
// throttle用法
function handle(){
console.log('节流函数降低调用频率');
}
window.addEventListener("mousemove",throttle(handle, 1000));
// deepClone用法
const liLei = {
name: 'lilei',
age: 28,
habits: ['coding', 'hiking', 'running']
}
// 深拷贝:实现一
const liLeiStr = JSON.stringify(liLei)
const liLeiCopy = JSON.parse(liLeiStr)
console.log(liLeiStr === liLeiCopy) // false
// 深拷贝: 实现二
const liLeiCopy1 = deepClone(liLei);
console.log(liLeiStr === liLeiCopy1) // false
// recursionTree 分析树结构用法
const tree = [
{
id: 0,
title: '节点0',
children: [
{
id: 1,
title: '节点1',
children: [
{
id: 3,
title: '节点3'
},
{
id: 4,
title: '节点4'
}
]
},
{
id: 2,
title: '节点2'
}
]
}
]
const allId = {}; // allId会拿到节点及其所有上下关系的详细信息
recursionTree(tree, { step: 1, allId, pIdList: [] })
console.log(allId)
// {
// 0: {
// childList: (4) [1, 3, 4, 2]
// item: {id: 0, title: '节点0', children: Array(2)}
// pId: undefined
// pIdList: []
// step: 1
// },
// 1: {
// childList: (2) [3, 4]
// item: {id: 1, title: '节点1', children: Array(2)}
// pId: 0
// pIdList: [0]
// step: 2
// },
// ...
// }
// arrayToTree 将带有引用关系的数组转换为树结构
const array = [
{id: 0},
{id: 1, pid: 0},
{id: 2, pid: 0},
{id: 3, pid: 1},
{id: 4, pid: 1},
{id: 5, pid: 2}
]
const newTree = arrayToTree(array);
console.log(newTree);
// [
// {
// id: 0,
// children: [
// {
// id: 1,
// pid: 0,
// children: [
// { id: 3, pid: 1},
// { id: 4, pid: 1},
// ]
// },
// {
// id: 2,
// pid: 0,
// children: [
// { id: 5, pid: 2}
// ]
// }
// ]
// }
// ]