Javascript "Record Collection": Need a deep and simple explanation please!

Javascript "Record Collection": Need a deep and simple explanation please!
0

#1

So I’m new to Javascript and so far everything is dandy until the “Record Collection” part of Basic Javascript in FreeCodeCamp. I thought I understood what the instruction for the particular exercise was but after two hours of toiling with it, I caved and went for the answer and the answer was not what I expected it so what I am asking is:

What was the purpose of the exercise?
Here’s the exercise instruction:

Write a function which takes an album’s id (like 2548), a property prop (like “artist” or “tracks”), and a value (like “Addicted to Love”) to modify the data in this collection.

If prop isn’t “tracks” and value isn’t empty (""), update or set the value for that record album’s property.

Your function must always return the entire collection object.

There are several rules for handling incomplete data:

If prop is “tracks” but the album doesn’t have a “tracks” property, create an empty array before adding the new value to the album’s corresponding property.

If prop is “tracks” and value isn’t empty (""), push the value onto the end of the album’s existing tracks array.

If value is empty (""), delete the given prop property from the album."

And what does each line of the answer function mean?

Here’s the code:

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

var collectionCopy = JSON.parse(JSON.stringify(collection));

**and this was the answer:**

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

  return collection;
}

Thank you in advance for taking your time out to help a newbie!


#2

I’ve edited your post for readability. When you enter a code block into the forum, precede it with a line of three backticks and follow it with a line of three backticks to make easier to read. See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.


#3

I am having the same problem! Did you ever figure it out?


#4

I am having a hard time figuring it out as well. Would love a detailed explanation of it.


#5

@kaijamh, @MsAura You can see the explanation in Get a Hint link.


#6

It’s not a very detailed explanation. For example, I do not understand why it is coded in that specific order, and not the order in which directions are given. I also do not understand what collection[id][prop].push(value); is included.


#7

Thanks @RandellDawson. Would you mind explaining this part? I got mostly everything correct except this. I dont understand the signifigance of [value] here.

else {
collection[id][prop] = [value];
}

#8

first it find the object in the collection object with the correct number for id, then it locate the prop property that needs the update, and then set its value to value assigned in the argument.
E.g.:

updateRecords(5439, "artist", "ABBA");

In this example

id == 5439;
prop == "artist"
value == "ABBA"

so the code collection[id] locates this object:

 "5439": {
      "album": "ABBA Gold"
    }

(It is the last one in the collection object ).
then it tries to locate "artist", since there is not an "artist" property, it will create one and set its value to "ABBA";
I hope this solve your problem, and I’m happy to do any further explanation.
Good Luck!


#9

hello ! anyone can help me on my coding ? :slight_smile:


#10

Maybe? what’s your problem?


#12

a hangman game , i need to like press start and guess the word if wrongly i wish to go down to the 2nd box , and then the score +1 after the word correct and then if the fail hits 6 the 2nd box displays You Lose , if the guessing is all correct displays You Win


#13

<!doctype html>

testhtml
Score:

Fails(6):


Start

#14

I suggest creating a new topic for your question. You should include a link to your code so far and a description of what peopblems you are facing and what you’ve tried so far to fix them.


#15

Hi @kaijamh. To my understanding it has to be in that specific order because that is how it will read and execute the code from top to bottom. If you go back to the “logical order in if else statements” lesson, it will explain why order is important.

Collection[id][prop].push(value);

Is included because by using push(), it adds the given value to the record, specifically “tracks” prop

If (prop === "tracks")

I hope this helped. If not, hoping someone can come in and save the day :sweat_smile:


#16

Thank you for you explanation. It actually makes sense! :grin: