IslandZzzz - 博客园

2022年6月19日

摘要： // 红黄绿：使用异步编程方案， promise, async await等都行 // 循环打印：一轮打印完了以后递归重复这一过程 const taskRunner = (light, timeout) => { return new Promise((resolve) => { setTime 阅读全文

posted @ 2022-06-19 16:53 IslandZzzz 阅读(403) 评论(0) 推荐(0)

js 手写数组转tree

摘要：先找到根(父)节点，然后根据根节点的id和数组元素的pid找到对应父子关系重复上一步骤 const getTree = (root, list) => { if(!Array.isArray(list)) throw 'list must be Array' root = root || list 阅读全文

posted @ 2022-06-19 16:41 IslandZzzz 阅读(131) 评论(0) 推荐(0)

2022年6月17日

React Hook useDragList 列表拖拽

摘要： Hook定义 useDragList import { useState } from "react"; interface DragPropsType { list: Array<any>, dragItemClassName: string } const checkValidDragItem 阅读全文

posted @ 2022-06-17 18:42 IslandZzzz 阅读(271) 评论(0) 推荐(0)

js draggable 拖拽效果数据传递

摘要： js draggable 拖拽效果 drag 拖拽中 dragstart 开始拖拽 dragover 拖拽悬浮时触发 dragenter 拖入目标节点 dragleave 离开源节点 drop 落进目标节点 event.dataTransfer.setData 拖拽时传输数据，可用于dragstar 阅读全文

posted @ 2022-06-17 15:57 IslandZzzz 阅读(893) 评论(0) 推荐(0)

js 手写随机数组洗牌算法数组乱序

摘要： const shuffle = arr => { let len = arr.length let rand = 0 while (len) { rand = Math.floor(Math.random() * len--) ;[arr[len], arr[rand]] = [arr[rand], 阅读全文

posted @ 2022-06-17 14:24 IslandZzzz 阅读(64) 评论(0) 推荐(0)

js 手写日期转换函数

摘要： js实现日期转换函数用yyyy,MM,dd固定字符串做替换 const dateFormat = (date, formatter) => { const fDate = new Date(date) const day = fDate.getDate() const month = fDate. 阅读全文

posted @ 2022-06-17 11:27 IslandZzzz 阅读(60) 评论(0) 推荐(0)

2022年6月14日

js 手写bind

摘要： bind返回一个函数闭包保存this, 执行的时候用apply或call绑定this js中new的优先级高于bind Function.prototype._bind = function (context) { if (typeof this !== "function") throw "ty 阅读全文

posted @ 2022-06-14 18:24 IslandZzzz 阅读(38) 评论(0) 推荐(0)

js 手写call apply

摘要：比较麻烦的是this指向的问题，但是可以通过"对象的函数调用指向对象自身"来处理如果没有传入context，那么this默认指向window Function.prototype._call = function (context) { const type = typeof this if ( 阅读全文

posted @ 2022-06-14 17:33 IslandZzzz 阅读(25) 评论(0) 推荐(0)

js 手写类型判断函数

摘要： js 手写类型判断函数判断引用类型调用Object.prototype.toString截取字符串判断基本类型返回typeof function getType(target) { if (target null) { return "null" } // 引用类型 if (typeof t 阅读全文

posted @ 2022-06-14 17:04 IslandZzzz 阅读(137) 评论(0) 推荐(0)

js Debounce Throttle 手写防抖与节流

摘要：手写防抖如果存在之前的计时器，取消重新计时。即多次点击只执行最后一次注意this指向和回调形参列表 <button onclick="clickMe(1)">click me</button> <script> const clickMe = debounce((a) => { console 阅读全文

posted @ 2022-06-14 16:23 IslandZzzz 阅读(52) 评论(0) 推荐(0)