- 博客(115)
- 收藏
- 关注
RSS订阅原创 可视化—gojs 超多超实用经验分享(四)
目录41.监听连线拖拽结束后的事件42.监听画布的修改事件43.监听节点被 del 删除后回调事件(用于实现调用接口做一些真实的删除操作)44.监听节点鼠标移入移出事件，hover 后显示特定元素45.监听树图实现鼠标点击节点本身展开或收起子节点的功能,而不是点击另外的按钮46.监听文本块编辑结束后回调事件(用于实现调用接口做一些真实的编辑修改操作)47.文本编辑结束后，实现回车后取消编辑状态用...
2024-07-18 11:13:00
629
原创 可视化—gojs 超多超实用经验分享(三)
目录32.go.Palette 一排放两个33.go.Palette 基本用法34.创建自己指向自己的连线35.设置不同的 groupTemplate 和 linkTemplate36.监听在图形对象 GraphObject 上的右键单击37.定义节点/连线/canvas 背景上的右键菜单38.从节点动态拉出一根连线时，判断其方向是左还是右?39.linkTemplate routing 取值4...
2024-07-17 11:07:00
551
原创 实现通用的表单清空重置功能
目录第一版单个表单实现功能并一步步优化公共方法抽离 mixins 混入终版 form1 和 form2 组件实现第一版单个表单实现功能并一步步优化通过一步步代码的优化，实现清空重置功能，尽量做到抽离后，可以直接复用，不需要修改任何变量名先实现一版，单个表单组件的清空和重置功能，此时 form1 组件可以实现parent.vue父组件中调用 form1 和 form2<template...
2023-09-01 10:53:00
590
原创 经典面试题函数柯里化： add(1)(2)(3) = 6
function currying() { const args = Array.prototype.slice.call(arguments); const inner = function () { args.push(...arguments); return inner; }; inner.__proto__[Symbol.toPrimitive] =...
2023-08-14 19:32:00
192
原创 通过自定义指令控制按钮权限
目录常见写法自定义指令小试牛刀常见写法通常控制按钮显示与否，会采用v-if或者v-show来控制，可能会写成以下形式,在通过动态的改变 active 变量的值，控制按钮的显示状态，<template> <div> <button v-if="(active = '1')">按钮一</button> <button v-...
2023-07-12 14:35:00
310
原创 Vue3 之 computed 计算属性的使用与源码分析详细注释
目录计算属性的基本用法计算属性的源码shared 工具方法抽离计算属性的基本用法computed 一般有两种常见的用法:一：传入一个对象，内部有 set 和 get 方法，属于ComputedOptions形式。在内部会有getter / setter两个变量来进行保存.const age = ref(18);const myAge = computed({ get() {}, ...
2023-07-06 15:28:00
297
原创 Vue3 之 reactive、ref、toRef、toRefs 使用与区别，源码分析详细注释
目录reactive、ref、toRef、toRefs 使用与区别reactiveref 作用及用法toRef 作用及用法toRefs 作用及用法ref,toRef,toRefs 源码实现解析详细注释reactive、ref、toRef、toRefs 使用与区别reactive参数传入普通对象，不论层级多深都可以返回响应式对象，(参数只能是对象)但是解构、扩展运算符会失去响应式ref...
2023-06-14 15:47:00
925
原创 Vue3 之 响应式 API reactive、 effect源码，详细注释
Vue3之响应式 API reactive、 effect源码，详细注释目录一.实现响应式 API:reactive、shallowReactive、readonly、shallowReadonly1. 针对不同的 API 创建不同的响应式对象2. 实现 createReactiveObject3. 实现不同的拦截函数 baseHandlers.ts二.实现响应式 effect1. 创建响应式...
2023-06-07 14:32:00
952
原创 可视化—gojs 超多超实用经验分享(二)
想了想序号还是接上一篇分享的的序号接着写，如果在本文中没有获取需要的答案，可以移步去看看上一篇的分享。gojs 超多超实用经验分享(一)目录22. 指定线段连接到节点的某一个特定的接口上23. 给节点设置连线端口spot24. 设置折叠面板及部分默认样式25. itemArray 抽离封装引用，面板中设置表格，并给表格设置边框26. 设置渐变色27. 与端口相邻的链路段的长度28. 设置/关...
2023-05-16 15:53:00
762
原创 常见的算法浅学一下，二分查找、插入冒泡归并排序
目录二分查找插入排序1 - javascript的原始实现2 - javascript的原始实现 —— 优化3 - 抛开原始实现。更好的算法实现4 - 完整的插入并排序的计算过程冒泡排序归并排序二分查找二分查找(Binary search)也称折半查找，是一种效率较高的查找方法。但是要求数组必须是有序的。最好时间复杂度是： O(1)，最好情况下只需要进行1次比较就能找到目标元素最坏**时...
2023-05-10 10:08:00
334
原创 TypeScript 学习笔记 — 模板字符串和类型体操（十五）
目录基本介绍字符串类型体操实操环节1. 字符串首字母大写 CapitalizeString2. 获取字符串第一个字符 FirstChar3. 获取字符串最后一个字符 LastChar4. 字符串转元组 StringToTuple5. 元组转字符串 TupleToString6. 重复字符串 RepeatString7. 字符串分割 SplitString8. 获取字符串长度 LengthOfSt...
2023-05-04 15:24:00
845
原创 可视化—gojs 超多超实用经验分享(一)
目录1. 设置分组模板，默认样式，统一最小宽度，展开收起状态监听2. 分组名称显示成员个数: 分组名称+成员个数: name(children)3. 分组成员为空时，不显示 placeholder 占位留白4. 分组第一次展开请求获取成员接口，监听展开收起状态 subGraphExpandedChanged:fn5. 设置节点模板6. 设置节点的 icon，此处以文字为例7. 文案太长截取显示....
2023-05-04 15:18:00
1870
1
原创 TypeScript 学习笔记 — 数组常见的类型转换操作记录（十四）
获取长度 lengthtype LengthOfTuple<T extends any[]> = T["length"];type A = LengthOfTuple<["B", "F", "E"]>; // 3type B = LengthOfTuple<[]>; // 0取第一项 FirstItemtype FirstItem<T ...
2023-04-24 16:03:00
503
原创 TypeScript 学习笔记 — 自定义类型:部分属性可选，反选 key，求对象交差并补集等（十三）...
目录将部分属性变为可选属性根据值的类型 反选 key写法一：基础原理写法，使用不同的内置类型，Pick 和 Omit写法二：基础原理写法，使用 Pick 内置类型 + 传参的方式写法三：使用映射条件做双重映射求对象的交集 ObjectInter求对象的差集 ObjectDiff求对象的并集 ObjectMerge求对象的补集 ObjectComp重写对象类型 Overwrite上文中介绍了 对...
2023-04-06 16:09:00
484
原创 TypeScript 学习笔记 — 基于对象操作的内置类型的使用（十二）
目录1.Partial 转化可选属性 (?)2.Required 转化必填属性 (-?)3.Readonly 转化仅读属性 (readonly)Mutate(非内置，与 Readonly 相对) (-readonly)4.Pick 挑选所需的属性5.Omit 忽略属性在前几章的笔记中，了解了以下几种内置类型：条件类型相关：Exclude 排除类型(差集)，Extract 抽取类型(交集)，...
2023-04-03 14:47:00
58
原创 TypeScript 学习笔记 — 类型推断和类型保护（十一）
目录类型推断1.赋值推断2.返回值推断3.函数推断(反向推断)4.属性推断5.类型反推6.索引访问操作符7.类型映射类型保护1.typeof 类型保护2.instanceof 类型保护3.in 类型保护4.可辨识联合类型5.null 保护6.自定义类型保护类型推断TypeScript 编译器会根据一些简单的规则来推断开发者定义的变量的类型， 当没有标明变量的类型时，编译器会将变量的初始值作为...
2023-03-30 15:09:00
123
原创 可视化—AntV G6 紧凑树实现节点与边动态样式、超过X条展示更多等实用小功能...
通过一段时间的使用和学习，对G6有了更一步的经验，这篇博文主要从以下几个小功能着手介绍，文章最后会给出完整的demo代码。目录1. 树图的基本布局和使用2. 根据返回数据的属性不同，定制不一样的节点样式3. 节点 label 文案显示过长时，通过截断的方式，显示...4. 当一个父节点包含children叶子节点时，label后显示children的长度,格式为：node.label(chil...
2023-03-29 14:37:00
822
原创 TypeScript 学习笔记 — 类型兼容 （十）
目录一.基本数据类型的兼容性二.接口兼容性三.函数的兼容性四.类的兼容性类的私有成员和受保护成员五.泛型的兼容性六.枚举的兼容性标称类型简短介绍TS 是结构类型系统(structural type system)，基于结构/形状检查类型，而非类型的名字。TS 中的兼容性，主要看结构是否兼容。(核心是考虑安全性),结构化的类型系统(又称鸭子类型检查),如两个类型名字不一样但是无法区分类型兼容性...
2023-03-20 15:07:00
107
原创 TypeScript 学习笔记 — infer 类型推导、类型兼容 （九）
目录1.ReturnType 返回值类型2.Parameters 参数类型3.InstanceType 实例类型4.ConstructorParameters 构造函数参数类型5.infer 实践更改元组类型将元组转换成联合类型获取 Promise 返回值类型(递归)类型推导: inference, 使用 infer 关键字只能用在条件类型中，用来提取类型的某一个部分的类型，放在不同的位置 ...
2023-03-14 15:38:00
236
1
原创 TypeScript 学习笔记 — 交叉类型、条件类型和条件分发（八）
目录交叉类型条件类型1. 直接传入判断的条件2. 把条件当成泛型传入3. 多重条件判断4. 判断接口中的类型extends 父子关系(类型等级)条件分发机制实际开发中如何避免？<T,U>判断 T 是不是 U 的子类型？判断两个类型完全相等？never 分发问题内置的条件类型1.Exclude 排除类型(差集)2.Extract 抽取类型(交集)3.NoNullable 非空检测4. ...
2023-03-07 14:36:00
508
原创 TypeScript 学习笔记 — 泛型的使用（七）
目录一.指定函数参数类型单个泛型多个泛型二.函数标注的方式类型别名 type接口 interface*案例分析：三.默认泛型四.泛型约束五.泛型接口使用六.类中的泛型泛型(Generics)是指在定义函数、接口或类的时候，不预先指定具体的类型，而在使用的时候再指定类型的一种特性。泛型可以用于 函数 对象 类...一.指定函数参数类型单个泛型案例：创建一个指定长度的数组，同时将每一项都填充...
2023-02-28 16:56:00
83
原创 TypeScript 学习笔记 — 接口的使用（六）
目录一.函数接口参数二.函数类型接口三.函数混合类型四.对象接口(最常用)确定属性可选属性任意属性只读属性可索引接口索引访问符类接口接口继承构造函数类型type 和 interface 的区别在 TS 中，使用接口(Interfaces)来定义对象的类型。可用于对类的一部分行为进行抽象以外，也常用于对对象的形状(Shape)进行描述。(接口都是抽象的，接口中不能含有具体的实现逻辑)一.函数接口...
2023-02-21 16:36:00
131
原创 TypeScript 学习笔记 — 类的基本用法（五）
目录TS 中定义类类中实例属性、方法 + 修饰符publicprotectedprivatereadonly实例方法类中原型属性、方法 + 访问器原型属性 + 访问器原型方法类中静态属性、方法子类重写父类方法类中 Super 属性修饰符 + constructor(){}抽象类 abstract抽象类定义实例方法及原型方法类的组成部分：构造函数、属性(实例属性、原型属性、静态属性)、方法(实例方...
2023-02-20 16:04:00
90
原创 TypeScript 学习笔记 — 函数中的类型（四）
目录函数的两种声明方式可选参数默认参数剩余参数函数的重载this 的类型对于函数主要关心的是：函数的入参类型 和 函数的返回值类型函数的两种声明方式通过 function 关键字来进行声明，不涉及到变量类型的标注function sum(a: string, b: string): string { // 限制函数的参数和返回值类型 return a + b;}sum("a...
2023-02-08 15:19:00
67
原创 TypeScript 学习笔记 — 类型补充void,any, tuple ,enum,nerver, Symbol , BigInt ,unknown（三）...
目录空值void 及(与Null 和 Undefined的区别)任意值Any元组类型枚举类型常量枚举never 类型1. 函数无法到达终点2.通常校验逻辑的完整性，可以利用 never 类型Symbol 类型BigInt 类型unknown 类型空值void 及(与Null 和 Undefined的区别)JavaScript 没有空值(Void)的概念，在 TS中，用 void 表示没有任何返...
2023-02-02 22:02:00
149
原创 leetcode 中等(设计)：[146, 155, 208, 211, 284, 304, 307, 341, 355, 380]
目录146. LRU 缓存155. 最小栈208. 实现 Trie (前缀树)211. 添加与搜索单词 - 数据结构设计284. 顶端迭代器304. 二维区域和检索 - 矩阵不可变307. 区域和检索 - 数组可修改341. 扁平化嵌套列表迭代器355. 设计推特380. O(1) 时间插入、删除和获取随机元素146. LRU 缓存var LRUCache = function (capaci...
2023-02-01 22:04:00
38
原创 leetcode中等(字符串)：[3, 6, 8, 49, 179, 299, 524, 539, 609, 648]
目录3. 无重复字符的最长子串6. Z 字形变换8. 字符串转换整数 (atoi)49. 字母异位词分组179. 最大数299. 猜数字游戏524. 通过删除字母匹配到字典里最长单词539. 最小时间差609. 在系统中查找重复文件648. 单词替换3. 无重复字符的最长子串var lengthOfLongestSubstring = function(s) { let arr = [...
2023-01-31 19:31:00
28
原创 leetcode简单(数组、字符串)：[219, 268, 349, 414, 485, 541, 557, 821, 925, 977]
目录219. 存在重复元素268. 丢失的数字349. 两个数组的交集414. 第三大的数485. 最大连续 1 的个数541. 反转字符串 II557. 反转字符串中的单词 III821. 字符的最短距离925. 长按键入977. 有序数组的平方219. 存在重复元素var containsNearbyDuplicate = function(nums, k) { for (let ...
2023-01-30 19:15:00
25
原创 leetcode简单(矩阵)：[566, 766, 832, 867, 999, 1030, 1261, 1275, 1337, 1351]
目录566. 重塑矩阵766. 托普利茨矩阵832. 翻转图像867. 转置矩阵999. 可以被一步捕获的棋子数1030. 距离顺序排列矩阵单元格1260. 二维网格迁移1275. 找出井字棋的获胜者1337. 矩阵中战斗力最弱的 K 行1351. 统计有序矩阵中的负数566. 重塑矩阵var matrixReshape = function(mat, r, c) { if (mat....
2023-01-29 23:36:00
39
原创 leetcode简单(双指针)：[88, 202, 345, 392, 455, 905, 922, 917, 925, 942]
[toc88. 合并两个有序数组var merge = function(nums1, m, nums2, n) { let A1 = nums1.slice(0, m) let A2 = nums2 // 追加哨兵 A1.push(Number.MAX_SAFE_INTEGER) A2.push(Number.MAX_SAFE_INTEGER) ...
2023-01-17 21:05:00
59
原创 leetcode简单(设计)：[225, 232, 303, 703, 705, 706, 933, 1603, 1656, 09, 30, 041, 03.06]
目录225. 用队列实现栈(先入后出)232. 用栈实现队列(先入先出)303. 区域和检索 - 数组不可变703. 数据流中的第 K 大元素705. 设计哈希集合706. 设计哈希映射933. 最近的请求次数1603. 设计停车系统1656. 设计有序流剑指 Offer 09. 用两个栈实现队列剑指 Offer 30. 包含min函数的栈剑指 Offer II 041. 滑动窗口的平均值面试题...
2023-01-12 22:06:00
178
原创 leetcode简单(数组,字符串,链表)：[168, 171, 190, 205, 228, 448, 461, 876, 836, 844]
目录168. Excel表列名称171. Excel 表列序号190. 颠倒二进制位205. 同构字符串228. 汇总区间448. 找到所有数组中消失的数字461. 汉明距离876. 链表的中间结点836. 矩形重叠844. 比较含退格的字符串168. Excel表列名称var convertToTitle = function(columnNumber) { let str = ''...
2023-01-10 19:32:00
30
原创 leetcode简单(数组,字符串,链表)：[66, 67, 70, 83, 121, 141, 160, 169, ,206, 338]
目录66. 加一67. 二进制求和70. 爬楼梯83. 删除排序链表中的重复元素121. 买卖股票的最佳时机141. 环形链表160. 相交链表169. 多数元素206. 反转链表338. 比特位计数66. 加一var plusOne = function(digits) { // 1. 从最后一个值进行开始遍历 // 2. 只要是%10===0，就直接继续遍历，否则返回值即可...
2023-01-09 19:21:00
31
原创 leetcode简单(数组,字符串,链表)：[1, 9, 13, 14, 20, 21, 26, 27, 35, 58]
目录1. 两数之和9. 回文数13. 罗马数字转整数14. 最长公共前缀20. 有效的括号21. 合并两个有序链表26. 删除有序数组中的重复项27. 移除元素35. 搜索插入位置58. 最后一个单词的长度1. 两数之和var twoSum = function(nums, target) { // 第一种 // var len = nums.length // for...
2023-01-09 19:18:00
34
原创 可视化—AntV G6 高亮相邻节点的两种方式
目录内置的高亮节点自定义高亮自定义高亮时保持原始颜色总结案例完整代码通过官方文档，可知高亮相邻节点分为两种方法，文档描述并不是很清楚，对刚接触这个库的小白并不是很友好，慢慢总结慢慢来吧内置的高亮节点是通过内置的Behavior activate-relations来实现，Behavior 是 G6 提供的定义图上交互事件的机制。与交互模式 Mode配合使用activate-relatio...
2022-12-28 15:57:00
1614
原创 优雅的写好Vue项目代码 — 路由拆分、Vuex模块拆分、element按需加载
目录路由的拆分VUEX模块拆分Element UI库按需加载的优雅写法路由的拆分项目较大路由较多时，路由拆分是一个不错的代码优化方案，按不同业务分为多个模块，结构清晰便于统一管理。require.context() 是webpack提供的语法， 相当于前端的读写文件，返回的 files是一个函数，files.keys()执行，返回获取到的文件名(是一个数组)，再通过files(keys)...
2022-11-01 20:26:00
231
原创 VLQ & Base64 VLQ 编码方式的原理及代码实现
目录VLQBase64 VLQVLQVLQ (Variable-length quantity)是一种通用的，使用任意位数的二进制来表示一个任意大的数字的一种编码方式。编码实现： ** 对数字137进行VLQ**编码，以下为分解步骤：将137转成二进制形式 —— 10001001七位一组做分组，不足的补前导0 —— 0000001 0001001最后一组开头补0，其余补1(1表示连...
2022-10-13 19:49:00
395
原创 Vue源码剖析
目录Vue 响应式数据Vue 中如何进行依赖收集Vue 中模板编译原理Vue 生命周期钩子Vue 组件 data 为什么必须是个函数？nextTick 原理set 方法实现原理虚拟 dom 的作用diff 算法的实现原理Vue 中 key 的作用和原理vue 初渲染流程vue 更新流程 依赖收集实现过程vue 异步更新的实现流程组件的初始化流程keep-alive 实现原理Vue 响应式数据什...
2022-09-26 19:16:00
221
原创 8行JS代码实现Vue穿梭框
实现效果完整 demo 参考<template> <div class="contain"> <ul class=""> <li class="count">{{num(leftData,true)}}/{{leftData.length}}</li> <li v-for="(city,i...
2022-09-17 20:59:00
107
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人