Iterate Over Object's Own Properties

JavaScriptJavaScriptBeginner
Practice Now

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

Introduction

In this lab, we will be working with iterating over an object's own properties in JavaScript. The purpose of this lab is to help you understand how to use the Object.keys() and Array.prototype.forEach() methods to loop through an object's properties and run a callback function for each one. By the end of this lab, you will have a better understanding of how to work with objects in JavaScript and how to manipulate their properties.


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("`JavaScript`")) -.-> javascript/BasicConceptsGroup(["`Basic Concepts`"]) javascript(("`JavaScript`")) -.-> javascript/AdvancedConceptsGroup(["`Advanced Concepts`"]) javascript(("`JavaScript`")) -.-> javascript/ToolsandEnvironmentGroup(["`Tools and Environment`"]) 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`") javascript/AdvancedConceptsGroup -.-> javascript/destr_assign("`Destructuring Assignment`") javascript/ToolsandEnvironmentGroup -.-> javascript/debugging("`Debugging`") subgraph Lab Skills javascript/variables -.-> lab-28454{{"`Iterate Over Object's Own Properties`"}} javascript/data_types -.-> lab-28454{{"`Iterate Over Object's Own Properties`"}} javascript/arith_ops -.-> lab-28454{{"`Iterate Over Object's Own Properties`"}} javascript/comp_ops -.-> lab-28454{{"`Iterate Over Object's Own Properties`"}} javascript/array_methods -.-> lab-28454{{"`Iterate Over Object's Own Properties`"}} javascript/destr_assign -.-> lab-28454{{"`Iterate Over Object's Own Properties`"}} javascript/debugging -.-> lab-28454{{"`Iterate Over Object's Own Properties`"}} end

How to Iterate Over an Object's Own Properties in JavaScript

To iterate over an object's own properties and practice coding, follow these steps:

  1. Open the Terminal or SSH.
  2. Type node to start a new Node.js session.
  3. Use the Object.keys() method to retrieve an array of the object's own properties.
  4. Use the Array.prototype.forEach() method to loop over each property and execute a provided function.
  5. The provided function should accept three arguments: the property value, the property key, and the object itself.
  6. Use the forOwn() function with the object and the provided function to iterate over the object's properties.

Here is an example code snippet:

const forOwn = (obj, fn) =>
  Object.keys(obj).forEach((key) => fn(obj[key], key, obj));

forOwn({ foo: "bar", a: 1 }, (v) => console.log(v)); // 'bar', 1

This code will log the values of the foo and a properties to the console.

Summary

Congratulations! You have completed the Iterate Over Object's Own Properties lab. You can practice more labs in LabEx to improve your skills.

Other JavaScript Tutorials you may like