【若川视野 x 源码共读】第36期 | omit.js 剔除对象中的属性

前言

文参加了由公众号@若川视野 发起的每周源码共读活动，点击了解详情一起参与。

omit是什么

omit是用来剔除对象数据中某些属性，返回剔除后的新对象。

omit如何使用

npm i --save omit.js

var omit = require('omit.js');
omit({ name: 'Benjy', age: 18 }, [ 'name' ]); // => { age: 18 }

omit源码解读

// 两个入参：obj --> 源对象，fields --> 待删除的属性数组
function omit(obj, fields) {
  // 通过Object.assign对源对象进行浅拷贝
  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;

omit VS delete

认识omit之前，更多是通过delete来删除对象中的某个属性

1. omit和delete的返回值

omit 返回的是删除属性后的新对象

delete 返回的是布尔值，删除成功为true，反之为false

const obj = { name: 'Benjy', age: 18 };
​
const result_omit = omit(obj, ['name']);
console.log('result_omit = ', result_omit); // { age: 18 }
​
const result_del = delete obj.name;
console.log('result_del = ', result_del); // true

2. omit可删除原型上的属性，delete无法删除

function Person(name) {
  this.name = name;
}
Person.prototype.age = 20;
​
const p = new Person("zhangsan");
​
console.log('p.age', p.age); // 18
delete p.age;
console.log('p.age', p.age); // 18
console.log(omit(p,['age'])); // {name: 'zhangsan'}

知识扩展

delete不能删除的变量

1. 激活对象的atruments
2. 声明的变量和函数
3. 函数、数组、字符串的length
4. 一些常量（Nan、Infinity、undefined）
5. 构造器的prototype（xxx.prototype）
6. 内置对象的属性（Math.PI...）
7. 正则对象的属性

Object.assign

objetct是对数据进行浅拷贝处理，omit的源码比我们常用的delete，多了一层数据封装，因此也兼容了一些非对象的数据数据删除。

Object.assign对数据的处理和一些注意点，戳这里查看

总结

扩展了对delte使用时需要注意的地方，也学习到了Object.assign使用和对数据的处理。