JavaScript手写源码之omit函数的实现

更新时间：2023年02月09日 10:02:05 作者：mick

最近突然有个新的想法，想去看看前端的小库来提升自己的编码能力。但是又不知道怎么去证明自己是否真的看懂了，那就实现一个omit函数吧

添加测试文件

我们通过vitest来实现测试的功能。

pnpm add -D vitest

然后再package.json文件中添加我们的执行脚本

 "scripts": {
    "test": "vitest"
  }

接着我们就可以编写测试文件了

import { describe, expect, test } from "vitest"
import { myOmit } from "."

describe("omit", () => {
  test("should create a shallow copy", () => {
    const mick = { name: "mick" }
    const copy = myOmit(mick, [])
    expect(copy).toEqual({ name: "mick" })
  })

  test("should drop fields which are passed in ", () => {
    const mick = { name: "mick", age: 18 }

    const copy = myOmit(mick, ["age"])

    expect(copy).toEqual({ name: "mick" })
    expect(mick).toEqual({ name: "mick", age: 18 })
    expect(myOmit(mick, ["name", "age"])).toEqual({})
  })
})

实现omit函数

我们要做的肯定是是要将测试文件通过。如果测试通过了，那就说明我们的功能基本上是已经实现了，剩下的是代码重构了。

根据测试文件我们可以看到，提出对象中的属性生成一个新的对象，但是原对象是不发生改变的。那可以用Object.assign,下面介绍一个Object.assign

Object.assign() 方法将所有可枚举（Object.propertyIsEnumerable() 返回 true）和自有（Object.hasOwnProperty() 返回 true）属性从一个或多个源对象复制到目标对象，返回修改后的对象。

我们首先利用Object.assign将原对象复制一份，然后遍历复制过后的对象将需要剔除的属性删除即可。

export function myOmit(value, args) {
  const shallowCopy = Object.assign({}, value)

  for (let i = 0; i < args.length; i++) {
    const key = args[i]
    if (key in shallowCopy) {
      delete shallowCopy[key]
    }
  }

  return shallowCopy
}

执行测试文件

到此这篇关于JavaScript手写源码之omit函数的实现的文章就介绍到这了,更多相关JavaScript omit函数内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

JavaScript库omit源码解析

深入理解js A*寻路算法原理与具体实现过程
这篇文章主要介绍了js A*寻路算法原理与具体实现过程,结合实例形式详细分析了A*寻路算法的具体概念、原理、实现方法与相关操作技巧,需要的朋友可以参考下
2018-12-12
bootstrap-table实现表头固定以及列固定的方法示例
这篇文章主要介绍了bootstrap-table实现表头固定以及列固定的方法示例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2019-03-03
JS插件clipboard.js实现一键复制粘贴功能
这篇文章主要介绍了JS插件clipboard.js实现一键复制粘贴功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2018-08-08
JavaScript实现数字数组正序排列的方法
这篇文章主要介绍了JavaScript实现数字数组正序排列的方法,涉及javascript中sort方法的使用技巧,非常具有实用价值,需要的朋友可以参考下
2015-04-04
JS数据类型分类及常用判断方法
这篇文章主要介绍了JS数据类型分类及常用判断方法,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
2020-11-11
JavaScript模拟实现网易云轮播效果
这篇文章主要介绍了如何利用JavaScript模仿网易云轮播效果的实现，文中的示例代码讲解详细，对我们学习有一定帮助，需要的可以参考一下
2022-04-04
JS面向对象编程之对象使用分析
在AJAX兴起以前，很多人写JS可以说都是毫无章法可言的，基本上是想到什么就写什么，就是一个接一个的函数function，遇到重复的还得copy，如果一不小心函数重名了，还真不知道从何开始查找错误
2010-08-08
Array的push与unshift方法性能比较分析
Array的push与unshift方法都能给当前数组添加元素，不同的是，push是在末尾添加，而unshift则是在开头添加。
2011-03-03
JavaScript防抖案例讲解
这篇文章主要介绍了JavaScript防抖案例讲解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下
2021-08-08
javascript 精确获取样式属性（上）
设置与获取样式属性是UI控件与特效库非常关键的部分，设置样式我们基本可以用cssText来包打天下，但获取样式就不是这回事了。
2010-01-01

JavaScript手写源码之omit函数的实现

目录

添加测试文件

实现omit函数

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具