「源码共读」第36期 | 可能是历史上最简单的一期 omit.js 剔除对象中的属性

323 阅读3分钟

项目解析

image.png

由此看目录可以断定 father 管理打包

father 是一款 NPM 包研发工具,能够帮助开发者更高效、高质量地研发 NPM 包、生成构建产物、再完成发布。它主要具备以下特性:

  • ⚔️ 双模式构建:  支持 Bundless 及 Bundle 两种构建模式,ESModule 及 CommonJS 产物使用 Bundless 模式,UMD 产物使用 Bundle 模式
  • 🎛 多构建核心:  Bundle 模式使用 Webpack 作为构建核心,Bundless 模式支持 esbuild、Babel 及 SWC 三种构建核心,可通过配置自由切换
  • 🔖 类型生成:  无论是源码构建还是依赖预打包,都支持为 TypeScript 模块生成 .d.ts 类型定义
  • 🚀 持久缓存:  所有产物类型均支持持久缓存,二次构建或增量构建只需『嗖』的一下
  • 🩺 项目体检:  对 NPM 包研发常见误区做检查,让每一次发布都更加稳健
  • 🏗 微生成器:  为项目追加生成常见的工程化能力,例如使用 jest 编写测试
  • 📦 依赖预打包:  开箱即用的依赖预打包能力,帮助 Node.js 框架/库提升稳定性、不受上游依赖更新影响(实验性)

scripts 脚本用于 father 来执行

image.png

调试打包

安装 package依赖

npm install 

打开源码项目 package.json

image.png

main主引导文件在 lib/index.js

根据目录结构并没有看见lib目录 由此可得lib为打包后的目录文件

根据 scripts 可以看出

image.png

前俩个 start、build 脚本都是 --storybook 的文档生成脚本

根据 father 打包构建工具来得出 father build为打包脚本

compile为该项目的打包脚本

image.png

运行完目录多出俩个文件夹

image.png

且出现 lib目录

打包调试ok 接下来调试 测试用例代码

调试测试

工作区目录可得 有一个 tests 目录

package.json 中 找到了 father test 脚本

image.png

打开 tests/index.test.js 测试文件

image.png

  • 第一个用例测试 用来测试 copy 和 benjy 的递归深度属性是否相同 和 俩个对象的浅层内存是否不同
  • 第二个 是用 omit 来剔除属性后 来校验 深度属性是否相同
  1. deepEqual - 比较的是深层属性 可以通过键值对匹配就可以
  2. notEqual - 比较浅层引用是否相同 类似于 js的 ==

手动通过 测试 新建一个 对象 然后 通过 对象结构剩余参数拿到仅剩 username 的对象来和 已经被剔除 password的obj 进行比较

 it("test", () => {
    const obj = { username: "admin", password: "123456" };
    const { password, ...afterObj } = obj;
    assert.deepEqual(omit(obj, ["password"]), afterObj);
  });

image.png

test 测试通过

src 源码解析

image.png

函数封装-拷贝浅层对象 然后移除需要剔除的属性数组并返回已经拷贝的对象

总结

omit.js的原理解析了一遍

对 测试用例 又复习了一遍