Suggestion - ES6 - Write Concise Object Literal Declarations Using Object Property Shorthand

JavaScript
1

Tell us what’s happening:
I recommend modifying the instructions for this lesson inside the code editor. “Only change code above/below this line” teaches learners to use return and use additional { } inside of an arrow function where they’re not necessary, which leads to more verbose, and less clean, code. Rather, the lesson should reinforce use of the syntax as shown in the lesson’s example:

const getMousePosition = (x, y) => ({ x, y });

While the return keyword can be used, it makes for cleaner code as an ES6 arrow function to remove the { } that are outside of the lines and instead write the solution as:

const createPerson = (name, age, gender) => ({name, age, gender});

After all, when JavaScript encounters this function and returns an output, its not as worried with the line separations as we are for styling and readability, it will simply return a single line output:

{name: 'stringName', age: integer, gender: 'stringGender'}

Your code so far

const createPerson = (name, age, gender) => {
  // Only change code below this line
  return {
    name,
    age,
    gender,
};
  // Only change code above this line
};

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:109.0) Gecko/20100101 Firefox/111.0

Challenge: {{challengeTitle}} ES6 - Write Concise Object Literal Declarations Using Object Property Shorthand

Link to the challenge:

2

Although I agree with you that the lesson should reinforce that idea of shorthand notation, the instructions are written in such a way that the user modifiable section can be parsed out for correctness by an algorithm looking for a certain format. Maybe the community can end up introducing an AI model that can do better processing of challenge code.

3

hello and welcome to fcc forum :slight_smile:

good point, but lets read from instructions and see whats been asked here to do first!!

Use object property shorthand with object literals to create and return an object with name, age and gender properties.

  • it simply “referring” to returning an object whwn “key and value are same” and “not necessarily” in strict es-6 format

perhaps you will see more es-6 strict syntax in your upcoming steps, happy learning :slight_smile:

4

I deeply agree with this post and created this account just to say so. The way the exercise is designed borders on being mis-educative. The explanation teaches us that we should form our answer as
const createPerson = (name, age, gender) => ({name, age, gender});
but the code editor does not allow us to enter the code in that way as though doing so would be wrong.

If the site cannot parse the answer for correctness in the way the example teaches because of a design limitation then why not have the example teach the learner both ways. It would be plenty clear which one the learner should chose when presented with the problem on the right side. The frustration I express in this post is the result of feeling like I was incompetent, but it was not my fault, it was an issue of instructional design. I do not mean to be ungrateful for the free resources that this site provides. I hope OP’s message is reinforced through this comment and the text of the explanation can be updated to benefit future learners. Thank you for your attention.

2 Likes
5

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.