The aim of this skill test is to help you assess whether you've understood our JavaScript object basics article.
Note: To get help, read our Test your skills usage guide. You can also reach out to us using one of our communication channels.
In this task you are provided with an object literal, and we want you to do some work on it.
To complete the task:
name property inside the catName variable, using bracket notation.greeting() method using dot notation (it will log the greeting to the console).color property value to black.The starting point of the task looks like this (nothing is shown yet):
Here's the underlying code for this starting point:
const cat = {
name: "Bertie",
breed: "Cymric",
color: "white",
greeting: function () {
console.log("Meow!");
},
};
// Don't edit the code above here!
// Add your code here
// Don't edit the code below here!
const section = document.querySelector("section");
let para1 = document.createElement("p");
let para2 = document.createElement("p");
para1.textContent = `The cat's name is ${catName}.`;
para2.textContent = `The cat's color is ${cat.color}.`;
section.appendChild(para1);
section.appendChild(para2);The updated output should look like this:
Your finished JavaScript should look something like this:
// ...
// Don't edit the code above here!
const catName = cat["name"];
cat.greeting();
cat.color = "black";
// Don't edit the code below here!
// ...In our next task, we want you to have a go at creating your own object literal to represent one of your favorite bands.
To complete the task:
band, which contains the following properties:name: A string representing the band name.nationality: A string representing the country the band comes from.genre: What type of music the band plays.members: A number representing the number of members the band has.formed: A number representing the year the band formed.split: A number representing the year the band split up, or false if they are still together.albums: An array representing the albums released by the band. Each array item should be an object containing the following members:name: A string representing the name of the album.released: A number representing the year the album was released.Note: Include at least two albums in the albums array.
bandInfo, which will contain a small biography detailing their name, nationality, years active, and style, and the title and release date of their first album.The starting point of the task looks like this (nothing is shown yet):
Here's the underlying code for this starting point:
let bandInfo;
// Don't edit the code above here!
// Add your code here
// Don't edit the code below here!
const section = document.querySelector("section");
let para1 = document.createElement("p");
para1.textContent = bandInfo;
section.appendChild(para1);The updated output should look something like this:
Your finished JavaScript should look something like this:
// ...
// Don't edit the code above here!
const band = {
name: "Black Sabbath",
nationality: "British",
genre: "heavy metal",
members: 4,
formed: 1968,
split: 2025,
albums: [
{
name: "Black Sabbath",
released: 1970,
},
{
name: "Paranoid",
released: 1970,
},
{
name: "Master of Reality",
released: 1971,
},
{
name: "Vol. 4",
released: 1972,
},
],
};
bandInfo = `The ${band.nationality} ${band.genre} band ${band.name} were active between ${band.formed} and ${band.split}. Their first album, ${band.albums[0].name}, was released in ${band.albums[0].released}.`;
// Don't edit the code below here!
// ...In this task, we want you to return to the cat object literal from Object basics 1.
To complete the task:
greeting() method so that it logs "Hello, said Bertie the Cymric." to the browser's console, but in a way that will work across any cat object of the same structure, regardless of its name or breed.cat2, which has the same structure and greeting() method, but a different name, breed, and color.greeting() methods to check that they log appropriate greetings to the console.The starting point of the task looks like this (nothing is shown):
Here's the underlying code for this starting point:
const cat = {
name: "Bertie",
breed: "Cymric",
color: "white",
greeting: function () {
console.log("Meow!");
},
};
// Don't edit the code above here!
// Add your code hereWe've not provided finished content for this task, as it doesn't print anything to the DOM. The output is all logged to the console. Your finished JavaScript should look something like this:Click here to show the solution
// ...
// Don't edit the code above here!
const cat2 = {
name: "Elfie",
breed: "Aphrodite Giant",
color: "ginger",
greeting: function () {
console.log(`Hello, said ${this.name} the ${this.breed}.`);
},
};
cat.greeting();
cat2.greeting();
In the code you wrote for Task 3, the greeting() method and properties are defined twice, once for each cat. This isn't ideal: specifically, it violates a principle in programming called DRY or "Don't Repeat Yourself". In this task we want you to improve the code so the object members are only defined once.
To complete the task:
new keyword to create the cat and cat2 instances.The starting point of the task looks like this (nothing is shown):
Here's the underlying code for this starting point:
const cat = {
name: "Bertie",
breed: "Cymric",
color: "white",
greeting: function () {
console.log(`Hello, said ${this.name} the ${this.breed}.`);
},
};
const cat2 = {
name: "Elfie",
breed: "Aphrodite Giant",
color: "ginger",
greeting: function () {
console.log(`Hello, said ${this.name} the ${this.breed}.`);
},
};
// Don't edit the code below here!
cat.greeting();
cat2.greeting();We've not provided finished content for this task, as it doesn't print anything to the DOM. The output is all logged to the console. Your finished JavaScript should look something like this:Click here to show the solution
class Cat {
constructor(name, breed, color) {
this.name = name;
this.breed = breed;
this.color = color;
}
greeting() {
console.log(`Hello, said ${this.name} the ${this.breed}.`);
}
}
const cat = new Cat("Bertie", "Cymric", "white");
const cat2 = new Cat("Elfie", "Aphrodite Giant", "ginger");
// Don't edit the code below here!
// ...