杜明清的个人博客

# eslint 知识点 # extends 与 plugins plugins 本质是为了加强 eslint 的扩展性，使我们可以直接使用别人写好的 eslint 规则，方便快速用于项目中。 官方规定 npm 包的扩展必须以 eslint-config - 开头，插件以 eslint-plugin - 开头，在使用过程中可以省略这个开头。 eslint-config - 文件是我们共享的一些配置文件，里面就是一个 JS 对象，其中包含一些配置信息，而 eslint-plugin - 文件是我们自定义的集合规则，可以导入和使用。 一个插件能带来： 额外的规则，如...

# 常见浏览器性能指标 # TTFB(Time To First Byte) 发出页面请求到接收到应答数据第一个字节的时间总和，包含了： DNS 解析时间 TCP 链接时间 发送 HTTP 请求时间 获得响应消息第一个字节的时间。 # FP（First Paint） 首次绘制时间，这个指标用于记录页面第一次绘制像素的时间。 # FCP（First Contentful Paint） 首次内容绘制时间，这个指标用于记录页面首次绘制文本、图片、非空白 Canvas 或 SVG 的时间。 # LCP（Largest Contentful...

# 概念 函数重载是指在编程语言中允许定义多个同名函数，但是他们的参数类型、参数个数或者返回类型不同，编译器或解析器会根据调用时提供的参数类型和个数来确定使用哪个函数 # 作用 函数重载的主要目的就是提高代码的可读性和灵活性，同时避免了为不同功能编写不同的函数名导致的变量命名冲突和混乱。 # 实现函数重载 # ts ts 中进行函数重载其实就是根据型参数组的个数和对变量进行 typeof 检测，然后根据不同的情况进行分支处理 // 函数重载的声明function average(numbers: number[]): number; // 函数签名 1：接受数字数组并返回数字function...

# 深拷贝 # 介绍 我们知道在 javascript 中有八种数据类型：其中 number，string，undefined，null，boolean，symbol 和 bigint 为基本数据类型，而 object 为复杂数据类型 #...

# 脚手架开发 常见工具包 Commander 提供一个连贯的 API ，用于定义 CLI 应用程序的各个方面，如命令、选项、别名和帮助。简化了命令行应用程序的创建。 yargs 脚手架开发框架，通过解析参数和生成优雅的用户界面来帮助您构建交互式命令行工具。 lerna 多 package 管理 Inquirer 一个易于嵌入且美观的 Node.js 命令行界面。 提供了很棒的查询会话流程。 Chalk Chalk 是一个非常简单的库，创建它的目的很简单 —— 给你的终端字符串添加样式。 colors 打印 不同颜色的log信息 ora 命令行 中高级的 、...

# # vue-router 源码 # vue-router 路由模式 # hash 模式（#） SEO 不友好，资源不变，不会刷新。 # history 模式（/） SEO 友好，重新请求资源。 history 模式发布时出现的问题： 发布到服务器上时，点击路由跳转正常但是刷新后路由跳转 404，出现的原因刷新后跳转的根路径并不是当前项目的 index.html 导致资源路径不匹配单页面应用路由，采取的方法是每次请求资源都 fallback 到 index.html 文件，可以使用静态资源服务器的支持。（例如在 nginx 中 location 字段添加：try_files 字段） #...

# jest 测试 市面上有很多测试框架，例如：mocha 、jasmine、vue test utils、vitest、react testing library 和 testing frameworks for jacascript 等，但语法和思想大致相同，现在依 jest 框架进行简单的使用 /** * jest 简单的语法 * expect toBe 语法 */test('tow plus to 4',()=>{ expect(2+2).toBe(4);})/** * toEqual 语法，递归检查对象或数组的每个字段...

# 链接本地文件的方式 # npm link 1、带有 package.json 文件的文件夹内运行：npm link ，即可在用户全局中创建该文件夹的全局链接。 2、在需要使用文件的地方执行：npm link 文件名，注意文件名是 package.json 中的 name 字段值。 # file 路径 在需要使用的 package.json 的 dependence 中添加：文件名："file: ...."，添加上 file 路径指向本地文件。 # 区别： 两种方式的区别在于如果项目较为简单，使用 file:...

# ESModule 和 CommonJS 的不同 导入导出语法不同 ESModule 是类似符号连接的方式，和导入的变量公用一块内存地址，CommonJS 是一份浅拷贝 ESModule 支持动态导入，ESModule 静态导入会被提升，可以在编译时分析依赖图，CommonJS 只有在运行时才会知晓依赖关系 ESModule 循环依赖会报错，CommonJS 循环依赖会返回加载过的内容 # modules 模块化 # 模块化的优点： 可维护性、可复用性。 # 模块化的发展 1、ES6 之前没有模块化时，浏览器环境需要使用 script 进行引入 js 文件 2、后来使用全局变量 +...

# TDD (test drive development) 测试驱动开发 # 测试驱动开发的口号： 测试先行 # 测试驱动开发的目标： 保证代码的简洁可用 # TDD 的规则 在 TDD...