摘要：当我们使用 react 或 Vue 开发项目时，我们可以通过使用 create-react-app，vue-cli 这样的命令行工具快速创建一个项目的脚手架。那么 create-react-app 这样的工具是怎样开发的呢？ 创建项目 首先我们需要创建一个新的项目用于开发我们的 CLI 项目。 先创 阅读全文

摘要：之前的文章介绍了使用 yapi-to-typescript （下文简称 ytt）生成接口类型定义文件，方便我们直接使用接口的请求和响应类型，能减少很多写接口类型的时间。 使用 yapi-to-typescript 生成接口响应数据的 TS 类型声明 既然能生成接口类型定义文件，那也就可以生成接口请求 阅读全文

摘要：小程序中的页面跳转分为 switchTab, navigateTo, redirectTo 三个方法。每次写跳转的时候都要考虑是怎样的跳转，该使用哪个方法，这无疑是不必要的心智负担。 为了解决这个问题就编写了一个统一跳转函数，整合了3个跳转方法。 话不多说，直接看代码： import { navig 阅读全文

摘要：小程序分享朋友圈目前的做法一般都是保存一个带有小程序二维码的海报到本地，网上也有不少相关文章，但是别人的不如自己的，这里记录一下自己生成海报保存到本地的方法。 本来一开始打算使用离屏 canvas 的，结果搞了半天发现小程序的离屏 canvas 和 通过 canvas 标签获取的有很多不同，简直就是 阅读全文

摘要：TS 是越写越爽，但是很不爽的是接口响应数据一堆，每次要去手写很麻烦。 最近正好后端接口文档从一个垃圾工具切换到了 Yapi，然后去搜了下可以通过接口文档自动生成 TS 类型声明，就自己搞了下，还是很简单顺利。 只需要几步级搞定了： 安装 yarn add yapi-to-typescript -D 阅读全文

摘要：generator 函数自执行 redux-saga 中使用 generator 函数来进行流程控制。通常的 generator 函数在 yield 的地方中止后，需要使用 next 来继续执行，但是 saga 使用中我们并没有调用 next，说明 saga 已经在内部进行了处理，那么它是怎么处理的 阅读全文

摘要：每个组件的 fiber 上都有个 memorizedState 属性用于存储这个组件的所有 hooks。hooks 中的每个 hook 也有个 memorizedState 用于存储这个 hook 的数据。而每个 hook 还有个 next 指向下一个 hook。 这里我们用链表实现 hooks 的 阅读全文

摘要：requestAnimationFrame 这个 API 已经出现很久了，网上也有很多相关文章，基本上都是说 requestAnimationFrame 有多好，是用来取代 setInterval setTimeout 的函数。 但是今天我就仔细思考了一下，这个 requestAnimationFr 阅读全文

摘要：原文链接 | 中文翻译版 这是一篇很经典的文章，通过循序渐进开发一个迷你版 react，让你明白 react 的基本原理。 本文只是将文章中的代码敲了一遍，通过注释描述各功能的作用，加上自己的理解。 注：代码中的 dom 变量表示通过 document.createElement 等方法创建的真实 阅读全文

摘要：hooks 是为了践行 代数效应，目的是把副作用从函数调用中剥离出去。 代数效应的自我理解：在代数中函数表达式为 y = f(x)，代数中的函数相同的入参必然会得到相同的结果，是没有副作用的。在程序中对应的就是纯函数。而 react 的 hooks 就是为了让组件看起来更像是一个纯函数，需要将函数的 阅读全文

摘要：useMemo 和 useCallback 都是进行性能优化的手段。 某大佬：性能优化总是会有成本的，而且并不总是带来好处。比起花的时间和代码可读性，一点点的性能优化显得微不足道，除了性能重灾区之外，都不值得这么去搞。 useMemo 的使用 export default function With 阅读全文

摘要：在 pixi.js 中，我们可以绘制矩形、原型、多边形等各种图形，也可以通过 lineTo，bezierCurveTo 方法来绘制线条。 绘制矩形、多边形等这种具有面积的图形后，我们可以通过 addListener 方法添加鼠标事件，但是绘制直线、贝塞尔曲线等线条后，这样做却不行了。为什么呢？因为线 阅读全文

摘要：如图所示，需求是在光标处插入一个占位符，前台展示的时候将占位符替换为需要的内容。 思路 在文本输入框中插入占位符，首先想到的是 textarea，但是 textarea 有个问题：只能插入文本，就算插入了自定义的占位符，但是只是普通文本，用户可以对占位符进行编辑。而我们更希望的是插入的占位符用户不能 阅读全文

摘要：将网构造为图中右边的边集数组结构，并且对它们按权值从小到大排序。如： const graph = [ { begin: 4, end: 7, weight: 7, }, { begin: 2, end: 8, weight: 8, }, ]; 注意在无向图中，创建此结构时，每条边的 begin 值应 阅读全文

摘要：有些配置项，我们希望在 webpack 打包后也能方便修改，比如接口地址、第三方链接等。 最近做的一个项目遇到了这样的需求，其实思路很简单，在 HTML 文件的 head 中引入一个 JS 文件，JS 文件往 window 添加全局对象，里面就是各种配置字段，开发的时候直接通过 window 使用这 阅读全文

摘要：今天做了一个 antd 的表格，该表格是个树形表格，也就是一行中还有 children 元素作为子行。 如图所示： 需求要求对二级元素即 children 元素进行筛选，但是 antd 自身的 onFilter 并不能筛选 children。。。我也在网上查询了相关信息，并没查到有效的解决方案，相对 阅读全文

摘要：HashMap 即哈希表，也叫散列表，是根据关键码值 key → value 而直接进行访问的数据结构。它通过把关键码值映射到表中一个位置来访问记录，有点类似于数组，并且能在O(1)（冲突情况另算）下查找到元素。 在 JS 中，我们最常使用的对象其实就是哈希表的实现。如： const o = { n 阅读全文

摘要：最近开发了一个项目，这个项目由 A, B, C 三方共同开发。我们是 B 方，登录相关都是由 A 进行开发，然后跳转到 B 和 C 的系统，将用户 token 通过 url 传递过来，我们通过 url获取 token 就能知道当前登录用户了。 但是我方和 C 方实现 token 获取时使用了不同的方 阅读全文

摘要：批量更新代码示例： let uid = 0; class Watcher { constructor () { this.id = ++uid; } update () { console.log('watch' + this.id + ' update'); queueWatcher(this); 阅读全文

摘要：今天在写代码的时候发现 class 中一些地方会有这样的写法： update(options) { this.elem.innerHTML = ''; this.init(options || this.options); } 一个方法中接收参数，如果调用此方法的时候没传这个参数则使用 class 阅读全文