首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

使用lodash或es6编写一个函数,该函数接受具有深度嵌套属性的对象,并返回仅具有选定属性的新对象

lodash是一个JavaScript工具库,提供了很多实用的函数,可以简化开发过程。ES6是JavaScript的一种版本,引入了许多新的语法和特性。

要编写一个函数,接受具有深度嵌套属性的对象,并返回仅具有选定属性的新对象,可以使用lodash的pick函数或ES6的解构赋值。

使用lodash的pick函数:

代码语言:txt
复制
const _ = require('lodash');

function pickProperties(obj, properties) {
  return _.pick(obj, properties);
}

const obj = {
  a: 1,
  b: {
    c: 2,
    d: {
      e: 3,
      f: 4
    }
  },
  g: 5
};

const selectedObj = pickProperties(obj, ['a', 'b.d.e', 'g']);
console.log(selectedObj);

使用ES6的解构赋值:

代码语言:txt
复制
function pickProperties(obj, properties) {
  const selectedObj = {};
  
  for (let property of properties) {
    let value = obj;
    for (let key of property.split('.')) {
      if (value && value.hasOwnProperty(key)) {
        value = value[key];
      } else {
        value = undefined;
        break;
      }
    }
    selectedObj[property] = value;
  }
  
  return selectedObj;
}

const obj = {
  a: 1,
  b: {
    c: 2,
    d: {
      e: 3,
      f: 4
    }
  },
  g: 5
};

const selectedObj = pickProperties(obj, ['a', 'b.d.e', 'g']);
console.log(selectedObj);

这个函数接受两个参数,一个是具有深度嵌套属性的对象,另一个是选定的属性数组。函数会遍历属性数组,通过逐级访问对象的属性,获取对应的值,并将其存储在新的对象中。最后返回新的对象。

这个函数的应用场景是在需要从一个对象中提取指定属性的情况下,可以用于数据过滤、数据转换等操作。

腾讯云提供了云计算相关的产品,其中与对象存储相关的产品是COS(对象存储),可以用于存储和管理大规模的非结构化数据。您可以在腾讯云的官方网站上了解更多关于COS的信息:腾讯云对象存储(COS)

请注意,以上答案仅供参考,具体实现方式可能因个人需求和环境而异。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

5个技巧让你更好编写 JavaScript(ES6) 中条件语句

2、减少嵌套,提前使用 return 语句 让我们扩展前面的示例,再包含另外两个条件: 如果没有提供水果,抛出错误 接受水果 quantity(数量)参数,如果超过 10,则打印相关信息。...注:如果你还不了解 ES6函数默认参数特性,可以查看 JavaScript 函数中默认参数 了解更多详情。 如果我们 fruit 是一个 Object 对象怎么办?我们可以指定默认参数吗?...如果您不介意使用第三方库,有几种方法可以减少空检查: 使用 Lodash get 函数 使用 Facebook 开源 idx 库(需搭配 Babeljs) 注:如果你还不了解 ES6 中 destructure...此外,如果你喜欢函数式编程(FP),您可以选择使用Lodash fp ,Lodash函数式能版本(方法名更改为 get  getOr)。...5、使用 Array.every 和 Array.some 来处理全部/部分满足条件 最后一个小技巧更多地是利用(但不是那么)Javascript Array函数来减少代码行。

1.3K20

使用React hooks处理复杂表单状态数据

您不可能为reducer中n个表单字段编写每个用例。 但是,useReducer中使用reducer函数只是一个返回更新状态对象普通函数。所以,我们可以做得更好。 ?...如果updateArg是一个函数,我们用当前状态调用它来计算函数。无论我们从这个函数返回什么对象都成为我们状态。 如果updateArg是一个普通旧Javascript对象,那么有两种情况。...1:对象没有_path和_value属性,因此是一个普通更新对象,就可以像使用this.setState一样。...2:对象具有_path和_value属性 - 当使用具有这两个属性对象作为参数,调用更新回调函数时。我们将此视为一种特殊情况,其中_path表示嵌套字段路径。...我们将使用lodashset方法。它接受路径表单作为更新和对象有效输入。 ? 但是,set方法就地改变对象并且不返回副本,但在React世界中,更改检测取决于Immutability(不可变)。

3.3K20
  • 比较 JavaScript 对象四种方式

    例如,让我们编写一个特殊函数 isHeroEqual() 来比较两个 hero 对象: 1function isHeroEqual(object1, object2) { 2 return object1...如果被比较对象具有一些属性,我更喜欢编写诸如 isHeroEqual() 之类比较函数。这类函数具有良好性能:在比较中只会涉及少数几个属性访问器和相等运算符。...另一方面,由于 hero1 和 hero3 具有不同属性,所以 shallowEqual(hero1, hero3) 将会返回 false。 但是 JavaScript 中对象是可以嵌套。...总结 引用相等性(使用 ===、 == Object.is())用来确定操作数是否为同一个对象实例。 手动检查对象是否相等,需要对属性值进行手动比较。...如果比较对象具有嵌套对象,则应该进行深度比较检查。

    1.1K30

    前端必读:Vue响应式系统大PK(下)

    基本方法 第一组 包括控制数据响应最基本方法 ref接受一个原始值一个普通对象,然后返回一个响应且可变ref对象。ref对象只有一个value指向原始值对象属性。...reactive接收一个对象返回对象反应性副本,内容会影响所有嵌套属性。...readonly接受一个ref一个对象(plain reactive),并将一个只读对象返回给原始对象,且会影响所有嵌套属性。 markRaw 返回对象本身,防止将其转换为代理对象。...和readonly: shallowRef创建一个ref,ref跟踪其value属性而不会使其值具有响应性 shallowReactive 创建一个响应式代理,代理跟踪其自身属性(不包括嵌套对象...) shallowReadonly 创建一个只读代理,代理使自己属性变为只读(不包括嵌套对象) 通过以下示例来感受这些方法使用: ?

    1.4K20

    在 JavaScript 中对象深拷贝(及其工作原理)

    例如,如果你有一个接受对象改变它函数,可能不想改变其原始对象。...复制对象一个 Object.prototype 方法,这不是复制对象时所需方法。 3. 如果对象具有作为对象属性,则复制对象实际上将会引用原始对象而不是创建副本。...对于仅存储基本类型(如数字和字符串)简单对象,上述浅层复制方法将起作用。但是如果对象具有对其他嵌套对象引用,则不会复制实际对象。你只会复制对其引用。...当从 Lodash 执行 clone 函数时,它会创建一个对象浅层副本,我们将其分配给 shallowClonedObject。...它没有为自己创造一个全新对象

    2.3K30

    尝鲜 ES2019 新功能

    ECMAScript 每年都会发布一个新版本,其中提案是已经正式通过分发给开发者和用户。本文将讨论语言最新版本,以及它又具有了什么新功能。...一个被展平数组是一个深度为 0 数组,flat() 接受一个参数,一个代表深度数字。深度指的是数组内嵌套数量。下面这个例子可以帮你理解嵌套深度。 ?...通常在 JavaScript 中,数组深度可以为无穷大,或者直到内存不足为止。假设一个数组嵌套深度为3,并且我们将其展平到深度 2,那么主数组中仍然会存在一个嵌套数组。 句法 ?...它接受一个键值对列表,返回一个对象对象属性由参数 entries 给出。它作用与 Object.entries()相反。 参数 接受任何可迭代对象,即数组。...ES10添加了一个名为 description 只读属性,它返回 Symbol 描述。 示例 ? 可以看到使用 Symbol .description 属性能够直接获取描述。

    2K40

    JavaScript 权威指南第七版(GPT 重译)(五)

    可迭代对象是任何具有特殊迭代器方法对象方法返回一个迭代器对象。迭代器是任何具有返回迭代结果对象next()方法对象。而迭代结果对象具有名为value和done属性对象。...你可以通过定义一个[Symbol.iterator]()方法返回一个具有next()方法返回迭代结果对象对象来实现自己可迭代对象。你也可以实现接受迭代器参数返回迭代器值函数。...类似地,Promise.reject()接受一个参数,返回一个将以值为原因拒绝 Promise。...(或者子类可以定义自己具有此名称属性,如果需要的话。) 在 ES6 及以后版本中,像map()和slice()这样创建返回数组方法稍作调整。...但如果任何代码尝试修改对象属性,处理程序对象方法会抛出 TypeError。这样代理可能有助于编写测试:假设你编写一个接受对象参数函数希望确保你函数不会尝试修改输入参数。

    24210

    JS对象那些事儿

    对象字面量属性值可以是任何数据类型,包括数组文字,函数嵌套对象字面量基本数据类型。...方法使用指定原型和旧对象属性创建一个对象。 注意:默认情况下,每个JavaScript函数都有一个原型对象属性(默认情况下它是空)。方法属性可以附加到此属性。 ?...我们创建了两个具有相同属性具有不同值对象。 5. Object.assign()。这是从其他对象创建对象另一种方法。 它将所有可枚举自有属性值从一个多个源对象复制到目标对象。...如果我们想要访问所有对象键值对情况下,会出现这种需求。 使用循环 - for in 和 for of 在 for in 情况下,它迭代一个对象逐个返回属性。 ?...Key将逐个对应对象属性,[key]返回值。对于for in循环也迭代原型链返回父键,所以如果你看到更多键,不要感到惊讶。

    2.4K10

    分享 9 个实用 JavaScript 技巧

    复制元素引用,而不复制元素本身。因此,如果元素是对象数组,复制数组仍将引用相同对象数组。...使用 JSON 技巧进行深度复制 要实现深度复制,一个流行技巧是结合使用 JSON.stringify() 和 JSON.parse()。...这个想法是将对象数组)序列化为 JSON 格式字符串,然后将其解析回对象。...Y // a // n // g map() 函数行为与 forEach() 基本相似,但有一个显着差异: map() 方法返回一个与原始数组长度相同数组,其中每个元素都是对相应元素调用函数结果...使用逗号运算符简化代码 由于逗号运算符语法,逗号在 JavaScript 中更加强大。 逗号 (,) 运算符计算每个表达式(从左到右)返回最后一个表达式值。

    19430

    2022高频前端面试题合集之JavaScript篇(上)

    参考答案: new 运算符创建一个用户定义对象类型实例具有构造函数内置对象实例。...一个柯里化函数首先会接受一些参数,接受了这些参数之后,该函数并不会立即求值,而是继续返回另外一个函数,刚才传入参数在函数形成闭包中被保存起来。...参考答案: *「promise.all(promiseArray)」 * 方法是 promise 对象静态方法,方法作用是将多个 promise 对象实例包装,生成返回一个 promise...当试图访问一个对象属性时,它不仅仅在对象上搜寻,还会搜寻对象原型,以及对象原型原型,依次层层向上搜索,直到找到一个名字匹配属性到达原型链末尾。 34....(搜狗) 参考答案: 柯里化,英语全称 Currying,是把接受多个参数函数变换成接受一个单一参数(最初函数一个参数)函数,并且返回接受余下参数而且返回结果函数技术。

    1.1K20

    JavaScript 权威指南第七版(GPT 重译)(四)

    Range()构造函数只需初始化this。构造函数甚至不必返回新创建对象。构造函数调用会自动创建一个对象,将构造函数作为对象方法调用,返回对象。...使用function关键字创建函数具有一个prototype属性属性值是一个对象,当使用new作为构造函数调用函数时,对象被用作所有创建对象原型。...例如,假设您正在编写一个函数,该函数接受一个对象参数并需要对对象执行一些耗时计算。为了效率,您希望缓存计算后值以供以后重用。...给定一个不包含任何非可序列化值(如 RegExp 对象类型化数组)对象数组(任意深度嵌套),您可以通过将其传递给JSON.stringify()来简单地序列化对象。...第二个参数是对象属性数组元素原始值。此外,该函数作为包含原始值对象数组方法被调用,因此您可以使用this关键字引用包含对象。 恢复函数返回值将成为命名属性值。

    46110

    分享 63 道最常见前端面试及其答案

    03、解释原型继承如何工作 原型继承允许一个对象通过建立原型链来继承另一个对象属性。 04、null、未定义未声明变量之间有什么区别?...调用堆栈按照后进先出顺序处理函数,而任务队列则按照先进先出顺序处理。 25、高阶函数定义是什么? 高阶函数是一种采用一个多个函数作为参数和/返回一个函数作为其结果函数。...ES6一个较旧术语,指的是 ECMAScript 第 6 版,而 ES2015 特指版本中引入功能。它们经常互换使用。 34、单元测试和功能/集成测试有什么区别?...高阶组件 (HOC) 是采用组件返回组件增强版本函数。它们支持代码重用、逻辑抽象,并为组件提供附加功能。HOC 是使用接受组件作为参数返回组件函数创建。...另一方面,“new Constructor()”创建一个对象,调用构造函数,将新创建对象设置为构造函数中“this”值,返回新创建对象

    33930

    分享63个最常见前端面试题及其答案

    03、解释原型继承如何工作 原型继承允许一个对象通过建立原型链来继承另一个对象属性。 04、null、未定义未声明变量之间有什么区别?...调用堆栈按照后进先出顺序处理函数,而任务队列则按照先进先出顺序处理。 25、高阶函数定义是什么? 高阶函数是一种采用一个多个函数作为参数和/返回一个函数作为其结果函数。...ES6一个较旧术语,指的是 ECMAScript 第 6 版,而 ES2015 特指版本中引入功能。它们经常互换使用。 34、单元测试和功能/集成测试有什么区别?...高阶组件 (HOC) 是采用组件返回组件增强版本函数。它们支持代码重用、逻辑抽象,并为组件提供附加功能。HOC 是使用接受组件作为参数返回组件函数创建。...另一方面,“new Constructor()”创建一个对象,调用构造函数,将新创建对象设置为构造函数中“this”值,返回新创建对象

    6.7K21

    42个实用JavaScript优化技巧

    我们可以通过3种不同方式来实现此功能。 在跳转到解决方案之前,让我们先了解一些定义。 parseFloat()函数解析一个参数(如果需要,首先将其转换为字符串)返回一个浮点数。...1)、使用ParseFloat parseFloat("183.456").toFixed(2); Math.round()函数返回四舍五入到最接近整数数字值。...每个ECMAScript版本都采用不同方式枚举对象。让我们检查一下。 Object.keys()方法返回给定对象自己可枚举属性名称数组,并以与普通循环相同顺序进行迭代。...如果返回false,则有可能正在执行其他函数,这些函数是专门在click内编写,而preventDefault则不允许执行任何操作。...在较早JavaScript版本中,这是通过使用apply方法完成apply()方法调用具有给定this值函数arguments以数组(类似数组对象形式提供。

    11.8K20

    前端-javascript简写技巧

    简写为: const dbHost = process.env.DB_HOST || 'localhost'; 2.3 对象属性 ES6 提供了一个很简单办法,来分配属性对象。...这时候可以使用箭头函数来简写: 简写为: 2.5 隐式返回返回值是我们通常用来返回函数最终结果关键字。...只有一个语句箭头函数,可以隐式返回结果(函数必须省略括号({ }),以便省略返回关键字)。 要返回多行语句(例如对象文本),需要使用()而不是{ }来包裹函数体。...简写为: 2.8 解构赋值 解构赋值是一种表达式,用于从数组对象中快速提取属性值,赋给定义变量。 在代码简写方面,解构赋值能达到很好效果。...在 ES6 中,介绍了一种名为 find()数组函数,可以实现 for 循环简写。

    1.5K30

    为什么我喜欢 JavaScript 可选链

    截至2019年8月,一项提案可选链(optional chaining)进入了第3阶段,将是一个很好改进。可选链接更改了从深层对象结构访问属性方式。...让我们看看可选链是如何通过在深度访问可能缺少属性时删除样板条件和变量来简化代码。 1. 问题 由于 JavaScript 动态特性,一个对象可以具有非常不同对象嵌套结构。...下一个任务编写一个返回电影主角姓名函数。...title); } 6.2 通常有更好选择 以下函数 hasPadding() 接受具有可选 padding 属性样式对象。...我喜欢可选链运算符,因为它允许轻松地从嵌套对象中访问属性。它可以防止编写针对访问者链中每个属性访问器上空值进行验证样板代码。

    72140

    深入学习下 TypeScript 中泛型

    函数将基于原始对象返回一个对象,但包含您想要键:代码语言:javascript复制function pickObjectKeys(obj, keys) { let result = {} for...,该函数遍历keys数组使用数组中指定键创建一个对象。...为此,您可以创建一个函数,它接受任何对象返回一个对象对象具有与原始对象相同键,但所有值都转换为字符串。这个函数将被称为 stringifyObjectKeyValues。...对象具有与模型相同属性,但类型设置为布尔值。在一个字段中传递 true 意味着您希望它被返回,而 false 则意味着您希望它被省略。...发生这种情况时,您可以使用内置助手从对象中省略字段。 这将返回 b 字段类型,即省略了 c 原始类型。现在评估结束,TypeScript 返回您要使用类型,省略嵌套字段。

    15310

    深入学习下 TypeScript 中泛型

    函数将基于原始对象返回一个对象,但包含您想要键: function pickObjectKeys(obj, keys) { let result = {} for (const key...,该函数遍历keys数组使用数组中指定键创建一个对象。...为此,您可以创建一个函数,它接受任何对象返回一个对象对象具有与原始对象相同键,但所有值都转换为字符串。这个函数将被称为 stringifyObjectKeyValues。...对象具有与模型相同属性,但类型设置为布尔值。在一个字段中传递 true 意味着您希望它被返回,而 false 则意味着您希望它被省略。...发生这种情况时,您可以使用内置助手从对象中省略字段。 这将返回 b 字段类型,即省略了 c 原始类型。现在评估结束,TypeScript 返回您要使用类型,省略嵌套字段。

    39K30
    领券