[V3] Implement new Concept Exercise: Objects

Getting started

Please please please read the docs before starting. Posting PRs without reading these docs will be a lot more frustrating for you during the review cycle, and exhaust Exercism’s maintainers’ time. So, before diving into the implementation, please read up on the following documents:

• Rationale for v3.
• The features of v3
• What are concepts and how they are structured?
• What are concept exercises and how they are structured?

Please also watch the following video:

• The Anatomy of a Concept Exercise.

See the documentation above (general documentation), as well as How to implement a Concept Exercise in JavaScript.

Goal

The goal of this exercise is to give a simple introduction to objects as maps/dictionaries.

Concepts

The following concept page needs to be created. You can use the same content for the introduction.md of the concept and the concept exercise. No need to create different content at this point.

• objects

Learning Objectives

In the concepts/introduction the student should learn about the following things and then practice them in the concept exercise.

• What are objects - for now describe them as maps/dictionaries that hold key-value pairs, more advanced things will be taught later
• Objects are the core building blocks in JavaScript
• How to create an object literal with {} (either empty or with some initial values)
• What is allowed as keys
• What is allowed as values (e.g., numbers, strings etc or other objects, arrays or even functions)
• How to add a key-value pair to an object, how to change the value of an existing key
• How to retrieve the value (show obj["key"] and obj.key notation)
• How to remove an entry
• How to check a key exists in the object with hasOwnProperty
• How to iterate through the keys with for ... in

Out of Scope

• Prototypes and classes
• all the built-in objects
• this
• Object destructering
• null and undefined (will be introduced in the next concept exercise, including when they show up in the context of objects, it is a bit hard to tiptoe around this in this concept/exercise but the student can’t learn everything at once)
• new Object() / Object.create

About.md of the Concept

Here some ideas of what could be mentioned.

• Pitfall: order of keys is not guaranteed, use Map/array instead
• Pitfall: setting a value to null or undefined does not delete the property, see this note
• Difference between hasOwnProperty and the in operator
• Show how to retrieve properties when there are nested objects
• Show how objects can be used as replacement for a switch statement since that is a very common pattern in JS and in many practice exercises
• Object.keys and Object.values
• Maybe more object methods like assign or freeze
• Create object without “default” properties.

Prerequisites

• numbers
• strings
• booleans
• arrays

At this point, the student does not know much more than these basics. Keep that in mind when designing the exercise. See this list for details on the learning curve we are aiming for.

Exercise Idea

• As a first part task 2,3 and 5 from Swift High Score Exercise could be used as a template.
• Additionally add maybe 2 more tasks:
  • One where some parameters of different types are passed and an object is returned (to demonstrate the types in an object can different in JS).
  • Another task where a function accepts an object like {a: 3, b: 4, fn: someFunction} and returns the result of calling someFunction(a,b).

Help

You can choose to do this solo-style, or collaborate with multiple people on this. The suggested approach is to

1. First accept this issue by saying “I’d like to work on this” (you will not get a response, just go with it) and optionally request that someone works with you (and wait for a second person to accept your request).
2. Use this issue to write down what you need (collect reference material) and discuss, if necessary, what to write and what not to write.
3. Draft a PR and request the feedback from at least one other JavaScript member (you can ping the #maintaining-javascript channel in Slack).

[junedev]

Update: I didn’t have time to work on this for a while but I am back on it now. The concept part is done, the exercise introduction and instructions as well. Now working on the “code” part.

[junedev]

(🙈)

@SleeplessByte Re the content: I usually read the MDN docs and javascript.info (and maybe also w3schools.com if I need it dumbed down even further) as inspiration. The about.md list is compiled from relevant things mentioned there and my own experience. The actual docs texts are then written from scratch, usually there is never a 1-to-1 fit in the resources for how I want to present things. Let me know if you have something else in mind I should use as base.