前言
本文参加了由大众号@若川视界建议的每周源码共读活动,点击了解概况一起参与。
本篇是源码共读第36期 | 可能是历史上最简略的一期 omit.js 剔除目标中的特点,点击了解本期概况
准备
首先omit.js
是什么?有什么效果?
虽然咱们可能都知道可是我还是简略粗犷用谷歌翻译下官方说明啊,那便是用于创建已删除某些字段的目标的浅表副本的有用函数。 具体是什么样子呢,官方有给举例
var omit = require('omit.js');
omit({ name: 'Benjy', age: 18 }, [ 'name' ]); // => { age: 18 }
另外,那个……自己真真一个英语白痴,omit单词都还不大会读,也是火速去谷歌查一下,omit有省略、忽略等意思ok,简略了解了下,现在就开始呗
- 拉取代码
git clone https://github.com/benjycui/omit.js.git
- 装置依赖
npm i
- 执行测验用例
npm run test
结果如下:
(实不相瞒,我一开始纠结于执行因为现已习气直接run serve/dev/start
跑起来看效果了,一拿到有点不知从哪开始也没看后面对应的语句,下意识执行了run start
结果途径个人大意选错了一直没效果我就更不知怎么下手了,下面会解说这些指令对应什么)
目录
package.json
{
"name": "omit.js", // 包名
"version": "2.0.2", // 迭代版别
"description": "Utility function to create a shallow copy of an object which had dropped some fields.", // 描绘
"main": "lib/index.js", // 进口文件
"module": "es/index.js", // ESM规范声明进口文件
"types": "index.d.ts", // TS类型声明进口文件
"files": [ // 被项目包含的文件名数组
"lib",
"es",
"dist",
"index.d.ts"
],
"scripts": {
"start": "father doc dev --storybook", // 运行项目并生成文档视图
"build": "father doc build --storybook", // 构建项目并生成文档视图
"compile": "father build", // 构建项目
"gh-pages": "father doc deploy", // 发布文档
"prepublishOnly": "npm run compile && np --yolo --no-publish", // 编译并发布包
"lint": "eslint .",
"test": "father test", // 运行测验用例
"coverage": "father test --coverage" // 测验覆盖率
},
"repository": { // git地址
"type": "git",
"url": "git+https://github.com/benjycui/omit.js.git"
},
"keywords": [ // 搜索关键字
"object",
"omit"
],
"author": "Benjy Cui<benjytrys@gmail.com>", // 作者
"license": "MIT", // 许可证
"bugs": {
"url": "https://github.com/benjycui/omit.js/issues" // bug提交地址
},
"homepage": "https://github.com/benjycui/omit.js#readme", // 项目包官网地址
"devDependencies": { // 开发环境所需以来
"@umijs/fabric": "^2.2.2",
"assert": "^1.4.1",
"eslint": "^7.4.0",
"father": "^2.29.5",
"np": "^6.3.1",
"rc-tools": "^6.3.3"
}
}
阅览的时候发现了一个自己从来没见过的东西father
,并且每一个脚本相关运行还都与其相关,就抓住去查阅了下
father
father 是umijs下根据rollup、docz、storybook、jest、prettier和eslint的打包和文档工具,npm指路 / git地址。如果感兴趣能够自己去官方具体阅览下,在此简略说下用到的这几个
"start": "father doc dev --storybook",
"build": "father doc build --storybook",
"gh-pages": "father doc deploy",
这三个脚本是docz配置,doc dev
将在开发环境下,展现项目中的.md
文档,本库中是README.md
文件, 发动后可看到
doc build
形式将会本地构建.doc目录,能够将其目录下文件上传到服务器。doc deploy
形式将会主动部署到gitHub目录。
"compile": "father build"
build
打包库,输出多种格式文件
"prepublishOnly": "npm run compile && np --yolo --no-publish"
我个人了解便是构建后运用np去帮助咱们快速发布npm包
单元测验
import assert from 'assert';
import omit from '../src';
describe('omit', () => {
it('should create a shallow copy', () => {
const benjy = { name: 'Benjy' };
const copy = omit(benjy, []);
assert.deepEqual(copy, benjy);
assert.notEqual(copy, benjy);
});
it('should drop fields which are passed in', () => {
const benjy = { name: 'Benjy', age: 18 };
assert.deepEqual(omit(benjy, ['age']), { name: 'Benjy' });
assert.deepEqual(omit(benjy, ['name', 'age']), {});
});
});
```assert```是个断语测验依赖包,此处运用了其两个办法```assert.deepEqual```和```assert.notEqual```。
前者是遍历目标一切本身的且可枚举的特点,进行比较持平。后者是比较不持平,只有在实际值等于预期值时,会抛出错误。什么可枚举比较是怎样呢,例如:
let obj = { a: 1};
let obj1 = Object.create(obj);
console.log(Object.keys(obj)); // ['a']
console.log(Object.keys(obj1)); // []
assert.deepEqual(obj, obj1);
// AssertionError: { a: 1 } deepEqual {} 此刻就不持平
let obj2 = obj
console.log(Object.keys(obj2)); // ['a']
assert.deepEqual(obj, obj2);
// OK
源码
function omit(obj, fields) {
// eslint-disable-next-line prefer-object-spread
const shallowCopy = Object.assign({}, obj);
for (let i = 0; i < fields.length; i += 1) {
const key = fields[i];
delete shallowCopy[key];
}
return shallowCopy;
}
export default omit;
- 函数内部创建一个局部变量shallowCopy 通过Object.assign将obj一切可枚举特点复制到shallowCopy
- fields传入的是一个目标特点名数组,将其循环遍历拿到各特点key,将存在于shallowCopy目标上的相对应的key进行移除
- 返回shallowCopy
注:这儿没加判别,我觉得加了判别会更完善一些
总结
- 学习了omit的源码完成
- 复习了
Object.assign
和Object.create
- 了解
father
- 了解测验用例的运用
一起也发现了个人的一些不足之处
- 对打包发布等了解甚少,自己之前只关注开发阶段,校验、单测、文档站、打包发布等还没着手,自己目前还没有发布过自己的npm包,下次能够测验下
- 不熟悉测验用例,没有写过,平常都是打断点