Record Collection
Problem Explanation
This problem is hard if you are new to JavaScript or programming, so don’t worry if you get stuck or need to ask for help. Asking for help is better than looking at the answer.
It is important to understand the overall goal of this function and then write code that supports that goal.
The id
parameter corresponds to a specific album object in the records
object.
You need to update this album object based upon the value
and prop
parameters:
- Your function must always return the entire
records
object. - If
value
is an empty string, delete the givenprop
property from the album. - If
prop
isn’ttracks
andvalue
isn’t an empty string, assign thevalue
to that album’sprop
. - If
prop
istracks
and value isn’t an empty string, add thevalue
to the end of the album’stracks
array. You need to create this array first if the album does not have atracks
property.
Finally, the problem wants you to return the records
object.
Hints
Hint 1
Use an if...else if
chain to check the different values of prop
and value
.
Hint 2
To access the value of a key in this object, you will use bracket notation: records[id][prop]
.
Hint 3
You can’t push
to an array that doesn’t exist. If the "tracks"
array does not exist yet, you need to create the "tracks"
array before pushing value
onto it.
Solutions
Solution 1 (Click to Show/Hide)
function updateRecords(records, id, prop, value) {
if (value === "") {
delete records[id][prop];
} else if (prop !== "tracks" && value !== "") {
records[id][prop] = value;
} else if (prop === "tracks" && value !== "") {
if (records[id].hasOwnProperty("tracks") === false) {
records[id][prop] = [];
}
records[id][prop].push(value);
}
return records;
}
Code Explanation
This version of the code explicitly handles every possible case with separate if clauses.
- First it checks if the
value
is an empty string. If it is, then theprop
is deleted. - Then, if
prop
is not"tracks"
and thevalue
is not an empty string. Theprop
is set to thevalue
. - If that check doesn’t pass, it next checks if
prop
is equal totracks
, thevalue
is not an empty string, and the record does not have a tracks array. The"tracks"
array is initialized with the only contents beingvalue
. - It next checks if
prop
is equal totracks
, thevalue
is not an empty string. The"tracks"
array must exist because the case above was not true. Thevalue
is pushed onto the end of the"tracks"
array.
Lastly, the entire records
object is returned.
Solution 2 (Click to Show/Hide)
function updateRecords(records, id, prop, value) {
if (value === '') {
delete records[id][prop];
} else if (prop === "tracks") {
records[id][prop] = records[id][prop] || []; // shortcircuit evaluation
records[id][prop].push(value);
} else {
records[id][prop] = value;
}
return records;
}
Code Explanation
This solution re-orders the code to make the if clauses simpler.
- First checks if
value
is a blank string. If so, then the key (prop
) is removed from the object. - If that first check doesn’t pass, then we know that
value
is not a blank string. It next checks ifprop
is equal to"tracks"
. The"tracks"
array is initialized if it does not exist, and thenvalue
is pushed into thetracks
array. (This step uses shortcircuit evaluation) - If both these checks fail (meaning
value
is not an empty string andprop
is not"tracks"
), then either a new key (prop
) and value (value
) are added to the object, or an existing key is updated if theprop
already exists.
Lastly, the entire records
object is returned.
Example Run
-
updateRecords(5439, "artist", "ABBA");
runs. -
value
is not a blank string, so the first condition of theelse if
statement fails. -
prop
is equal to"artist"
, not"tracks"
, so the second condition of theelse if
statement fails. - in the ‘else’ clause,
artist: "ABBA"
is added to the5439
id
.
Relevant Links
- fCC’s challenge: Accessing Objects Properties with Bracket Notation
- fCC’s challenge: Add New Properties to a JavaScript Object
- fCC’s challenge: Delete Properties from a JavaScript Object
- fCC’s challenge: Accessing Nested Objects
- “Array.prototype.push()” - MDN JavaScript reference
- “delete operator” - MDN JavaScript reference
- shortcircuit evaluation
Solution 3 (Click to Show/Hide)
function updateRecords(records, id, prop, value) {
// Access target album in record collection
const album = records[id];
// Update the album
if (value === "") {
delete album[prop];
} else if (prop !== "tracks") {
album[prop] = value;
} else {
album["tracks"] = album["tracks"] || [];
album["tracks"].push(value);
}
// Return the full collection
return records;
}
Code Explanation
This solution uses the fact that objects are passed into functions as references to slightly simplify the solution syntax.