Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
jadaml
11,593 PointsWhy is the parameter name `value` being used in the `.map` method rather than `key`?
Maybe I am misunderstanding things here, but what he is passing into the posts object is a key, no?
"I like to run!": {
"title": "I like to run",
"description": "blah blah blah"
},
...
Object.keys(posts); returns an array of keys...
So return posts["I like to run!"] is saying, hey post object, please return the VALUE that lives at this "I like to run!" KEY I am providing you.
4 Answers
Nicholas Gault
10,544 PointsI believe that this is a good question, as the instructor has used language that is, at best, highly confusing. The instructor subsquently makes several statements that are unambiguously incorrect, adding to the confusion.
As the questioner states, the instructor correctly states that 'object.keys' generates an array of 'keys'. Those 'keys' are then map'd to 'values'. Choosing 'value' as the argument for the map'ing function may not strictly speaking be a bug, but it's distinctly confusing because it's the wrong side of the key-value pair. (In other words, it's the worst possible word for the variable name). A more "conventional", clearer formulation:
object.keys(posts).map(function(key) {
return posts[key]; // return the value (which is an object) for that key
}
The instructor then incorrectly states that the "function returns an object corresponding to the VALUE" (which my friend spent a long time grappling with). In fact, the function does not return an object corresponding to a value, but rather to a KEY.
Without trying to enumerate all the inaccuracies in the video, one that created a good deal of confusion for my friend was the repeated statement that the "pattern turns an object into an array". While a common and useful pattern, the pattern in the video does not do that. Rather, the pattern extracts the values from a list of key-value pairs, discarding the keys as it creates an array. In other words, half of the information in the object is elimintated with the transformation to an array. "Turning an object into an array" is another kind of important, well-known pattern (requiring that both keys and values from the original object are retained for use in the array). The pattern in this video isn't that.
Dante Harti
Courses Plus Student 2,813 PointsYou can change the parameter name any way you like it... here in his example, he named it "value" instead of "key".
Value referring to the value of array created using the Object.keys(posts).
Points to consider: <ol>
- Since the parameter name used was (value) then posts[value] was used to access the object.
- Since we know that the value = key then we can say that posts[value] = post['key']
- Therefore he actually used the key to access the object. </ol>
It's just the way he named his parameter.
Zachary Piper
7,543 PointsLike you said Object.keys(obj) returns an array of the keys in an object obj. Keys are the names of the properties defined on an object. So Object.keys(posts) would return something like the array ["title", "description"]. "I like to run!" is not a key, it is a value.
Nicholas Gault
10,544 PointsHi Zachary Piper, It's confusing, but I believe you are exactly wrong. "I like to run" is in fact the key, not the value. The value corresponding to that key is:
{
"title": "I like to run",
"description": "blah blah blah"
}
The array of keys returned by Object.keys(posts) is:
["I like to run" , "Crossfit is cool", "Swimming is good for the joints"]
Each of these three keys is then used to return the object which is its corresponding "value" in the right side. If you rewatch the video at around 4:00, you'll see these things displayed in the node-inspector debugger.
Dante Harti
Courses Plus Student 2,813 PointsNicholas Gault. I have thought about this question and created a long explanation about this but didn't post it earlier since it wasn't the question. Zachary Piper is actually correct too when he is saying that it is the value that was used.
Long explanation
I have explained here how you can interchanged the VALUE of the array or the Key of posts based on his example.....
Object.keys(posts) method returned the array of keys in our posts.json file, which are now the new VALUES of the new array.
Then by using the the array.map() method, it will create a new array by looping around the VALUES of "Object.keys(posts) array" as the arguments which we know are the same strings that are contained in the posts object keys.
As shown in this video, Accessing Object Properties with Dave McFarland https://teamtreehouse.com/library/javascript-loops-arrays-and-objects/tracking-data-using-objects/accessing-object-properties
To access an object, we need to write the key name like this: posts['key'];
So the VALUE "I like to run" which is also the exact string for the key to access the object with title and description when placed in the format post['key']
posts["I like to run"] will give us the object containing: { "title": "I like to run", "description": "blah blah blah" }
and same with the other objects. Which now will then be combined into the new array.
Since Value is the parameter name, we confused it that we are using the value instead of the key. But since it's just the same, it would have the same end result.
(Just a thought, but not sure if it's correct.....but to shorten it since VALUE = KEYS)
we can also think about it as....
Object.key(posts) method --- created an array of the keys of the posts object then using the map method, we loop around using the keys (which is equivalent to the value of the arrays) as the parameter to retrieve the objects containing the title and description.
Darryn Smith
32,043 PointsPerhaps it would have been smarter to steer clear of 'value' AND 'key' in naming the variable(s) in question, and instead tried to be descriptive in a different way such as:
object.keys(posts).map(function(blogEntryTitle) {
return posts[blogEntryTitle];
});
Just a thought.
Antonio Jaramillo
15,604 PointsAntonio Jaramillo
15,604 PointsI can see the value (see what I did there?) of using either variable name within context. As a learner, using the variable "value" makes sense in the you are essentially returning a value. However(!!!!), in our journey to becoming programming experts, I would prefer to use the variable name "key", as THAT is what we are in fact mapping. The return statement in itself implies that we are returning the value of that key.