Sitemap

Update Javascript Object’s Properties

4 min readJan 30, 2023

--

Press enter or click to view image in full size
Code solution

Above is the solution to a freecodecamp challenge on JS data structure and algorithm. This is the link to the challenge. Code is at the end of the blog.

Here are some of my notes attempting to solve it:

JS object properties

Below is the given object recordCollection .

const recordCollection = {
2548: {
albumTitle: 'Slippery When Wet',
artist: 'Bon Jovi',
tracks: ['Let It Rock', 'You Give Love a Bad Name']
},
2468: {
albumTitle: '1999',
artist: 'Prince',
tracks: ['1999', 'Little Red Corvette']
},
1245: {
artist: 'Robert Palmer',
tracks: []
},
5439: {
albumTitle: 'ABBA Gold'
}
};

Javascript object’s values are written in key:value pairs.

Example: const cat = {breed: 'Ragdoll', age: 4}

Use object.key to access its value. Example: cat.breed returns 'Ragdoll' .

In this challenge, the object recordCollection has nested/child objects which are the album ids 2548 , 2468 , 1245 , 5439 . These child objects have corresponding key:value pairs, for example the child object 1245 has two key:value pairs of artist: 'Robert Palmer' and tracks: [] .

JS constant objects

“Constant” is misleading in JS. The keyword const does not define an object but its reference to the object. Hence, a constant object can NOT be reassigned. But its properties CAN be changed.

Example:

const cat = {breed: 'Ragdoll', age: 4};

cat.breed = 'Birman'; // reassign breed to a new value
cat.color = 'grey'; // append a new property

const cat = {breed: 'Birman', color: 'grey'}; // this is not allowed

Write a function to update the object’s properties

Write a function that takes four parameters: records , id , prop , value and returns records .

Looking at the given object, each album has a unique id number as its key and several other properties. Not all albums have complete information.

Get Lyam’s stories in your inbox

Join Medium for free to get updates from this writer.

The function must satisfy all the following requirements:

  • The function must always return the entire record collection object.
  • If prop isn't tracks and value isn't an empty string, update or set that album's prop to value.
  • If prop is tracks but the album doesn't have a tracks property, create an empty array and add value to it.
  • If prop is tracks and value isn't an empty string, add value to the end of the album's existing tracksarray.
  • If value is an empty string, delete the given propproperty from the album.

Given function to modify:

function updateRecords(records, id, prop, value) {
return records;
}

Logic

The requirements can be simplified as:

  • If the argument passed to prop is tracks , and the album does not have a tracks property then create an empty array named tracks .
  • If the argument passed to prop is tracks , and the argument passed to value is not an empty string '' , then append that value to the array tracks
  1. else if the argument passed to prop is not tracks, and the argument passed to value is not an empty string'', then assign value to prop
  2. else if value is an empty string '', then delete the prop property from the album

Checks before writing the function

  1. Accessing object’s properties using dot notation or brackets:
const cat = {breed: 'Ragdoll', age: 4};

cat.breed // returns the string 'Ragdoll'
cat[breed] // returns the string 'Ragdoll'

2. Appending object’s properties using dot notation:

const cat = {breed: 'Ragdoll', age: 4};

cat.color = 'grey' // adds a new key:value pair color: 'grey'

3. Comparison operators

Press enter or click to view image in full size

4. In a conditional test expression, an object’s property can be used as the expression. If the property exists, the epression is evaluated true , and false otherwise.

const cat = {breed: 'Ragdoll', age: 4};

if (cat.breed) {console.log(true)}
else {console.log(false)} // prints true to console

5. To append a new element to an array use the .push() method

var cats = ['Meo Meo', 'Na'];

cats.push('Pew'); // this adds 'Pew' to the end of the array cats

6. Delete a property from an object will delete its key and value delete object.property

const cat = {breed: 'Ragdoll', age: 4};

delete cat.breed // delete key:value pair of breed: 'Ragdoll'

Final function

function updateRecords(records, id, prop, value) {
if (prop === "tracks" && (!(records[id]).tracks))
{records[id].tracks = [];}

if (prop === "tracks" && value !== "")
{records[id].tracks.push(value);}

else if (prop !== "tracks" && value !== "")
{records[id][prop] = value;}

else if (value === "")
{delete records[id][prop];}

return records;
}

--

--

Lyam
Lyam

Written by Lyam

Lyam documents his learning journey as a web developer