为对象属性设置默认值

JavaScriptJavaScriptBeginner
立即练习

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

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

简介

在本实验中,我们将探讨一个为对象属性分配默认值的 JavaScript 函数。此函数有助于简化确保对象中所有属性都有值的过程,即使这些属性最初是未定义的。通过使用 Object.assign() 方法和展开语法,我们可以轻松创建一个具有默认值的新对象,同时保持原始的键顺序。


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("`JavaScript`")) -.-> javascript/BasicConceptsGroup(["`Basic Concepts`"]) javascript(("`JavaScript`")) -.-> javascript/AdvancedConceptsGroup(["`Advanced 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/AdvancedConceptsGroup -.-> javascript/destr_assign("`Destructuring Assignment`") javascript/AdvancedConceptsGroup -.-> javascript/spread_rest("`Spread and Rest Operators`") subgraph Lab Skills javascript/variables -.-> lab-28267{{"`为对象属性设置默认值`"}} javascript/data_types -.-> lab-28267{{"`为对象属性设置默认值`"}} javascript/arith_ops -.-> lab-28267{{"`为对象属性设置默认值`"}} javascript/comp_ops -.-> lab-28267{{"`为对象属性设置默认值`"}} javascript/destr_assign -.-> lab-28267{{"`为对象属性设置默认值`"}} javascript/spread_rest -.-> lab-28267{{"`为对象属性设置默认值`"}} end

如何为对象属性设置默认值

要为对象中所有 undefined 的属性设置默认值,请按以下步骤操作:

  1. 打开终端/SSH 并输入 node 开始练习编码。
  2. 使用 Object.assign() 创建一个新的空对象,并复制原始对象以保持键顺序。
  3. 使用 Array.prototype.reverse() 和展开运算符 (...) 从左到右组合默认值。
  4. 最后,再次使用 obj 覆盖最初有值的属性。

以下是一个代码片段示例:

const defaults = (obj, ...defs) =>
  Object.assign({}, obj, ...defs.reverse(), obj);

defaults({ a: 1 }, { b: 2 }, { b: 6 }, { a: 3 }); // { a: 1, b: 2 }

此代码片段将返回一个对象,该对象为原始对象中所有未定义的属性设置了默认值。

总结

恭喜你!你已经完成了“为对象属性设置默认值”实验。你可以在 LabEx 中练习更多实验来提升你的技能。

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