基于函数匹配对象属性

JavaScriptJavaScriptBeginner
立即练习

This tutorial is from open-source community. Access the source code

💡 本教程由 AI 辅助翻译自英文原版。如需查看原文,您可以 切换至英文原版

简介

在本实验中,我们将探索 JavaScript 中的 matchesWith 函数。本实验的目的是学习如何比较两个对象,并根据提供的函数确定它们是否包含等效的属性值。我们将使用 Object.keys()Array.prototype.every()Object.prototype.hasOwnProperty() 来完成此任务。


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("`JavaScript`")) -.-> javascript/BasicConceptsGroup(["`Basic Concepts`"]) javascript/BasicConceptsGroup -.-> javascript/variables("`Variables`") javascript/BasicConceptsGroup -.-> javascript/data_types("`Data Types`") javascript/BasicConceptsGroup -.-> javascript/arith_ops("`Arithmetic Operators`") javascript/BasicConceptsGroup -.-> javascript/comp_ops("`Comparison Operators`") javascript/BasicConceptsGroup -.-> javascript/array_methods("`Array Methods`") subgraph Lab Skills javascript/variables -.-> lab-28337{{"`基于函数匹配对象属性`"}} javascript/data_types -.-> lab-28337{{"`基于函数匹配对象属性`"}} javascript/arith_ops -.-> lab-28337{{"`基于函数匹配对象属性`"}} javascript/comp_ops -.-> lab-28337{{"`基于函数匹配对象属性`"}} javascript/array_methods -.-> lab-28337{{"`基于函数匹配对象属性`"}} end

使用函数匹配对象属性

要开始练习编码,请打开终端/SSH 并输入 node

此函数用于比较两个对象,并检查第一个对象是否包含与第二个对象等效的属性值。它会根据提供的函数来进行此操作。

要使用此函数,请遵循以下步骤:

  • 使用 Object.keys() 获取第二个对象的所有键。
  • 使用 Array.prototype.every()Object.prototype.hasOwnProperty() 和提供的函数来确定第一个对象中是否存在所有键并且具有等效值。
  • 如果未提供函数,则使用相等运算符比较值。
const matchesWith = (obj, source, fn) =>
  Object.keys(source).every((key) =>
    obj.hasOwnProperty(key) && fn
      ? fn(obj[key], source[key], key, obj, source)
      : obj[key] == source[key]
  );

以下是如何使用此函数的示例:

const isGreeting = (val) => /^h(?:i|ello)$/.test(val);
matchesWith(
  { greeting: "hello" },
  { greeting: "hi" },
  (oV, sV) => isGreeting(oV) && isGreeting(sV)
); // true

此示例检查两个对象在 greeting 属性上是否具有等效值。它使用 isGreeting 函数来确保两个值都是有效的问候语。

总结

恭喜你!你已经完成了“基于函数匹配对象属性”实验。你可以在 LabEx 中练习更多实验来提升你的技能。

您可能感兴趣的其他 JavaScript 教程