Get Programming with JavaScript

Get Programming with JavaScript - Listing 4.11

Listing 4.11 - Using the same function with multiple objects

var movie1;
var movie2;
var movie3;
var movie;
var showMovieInfo;

movie1 = {
    title: "Inside Out",
    actors: "Amy Poehler, Bill Hader",
    directors: "Pete Doctor, Ronaldo Del Carmen"
};

movie2 = {
    title: "Spectre",
    actors: "Daniel Craig, Christoph Waltz",
    directors: "Sam Mendes"
};

movie3 = {
    title: "Star Wars: Episode VII - The Force Awakens",
    actors: "Harrison Ford, Mark Hamill, Carrie Fisher",
    directors: "J.J.Abrams"
};

showMovieInfo = function () {
    console.log("Movie information for " + movie.title);
    console.log("------------------------------");
    console.log("Actors: " + movie.actors);
    console.log("Directors: " + movie.directors);
    console.log("------------------------------");
};

movie = movie1;
showMovieInfo();

movie = movie2;
showMovieInfo();

movie = movie3;
showMovieInfo();

Further Adventures

Listing 4.11 - Using the same function with multiple objects - Task 1

Create an object to represent a multiple choice quiz question.

var question1;    // Declare a variable

// Assign an object to the variable
question1 = {
    question: "What is the capital of France?",
    answer1: "Bordeaux",
    answer2: "F",
    answer3: "Paris",
    answer4: "Brussels",
    correctAnswer: "Paris"
};

Listing 4.11 - Using the same function with multiple objects - Task 2

Create two more quiz question objects.

var question1;
var question2;    // Declare variables
var question3;

question1 = {
    question: "What is the capital of France?",
    answer1: "Bordeaux",
    answer2: "F",
    answer3: "Paris",
    answer4: "Brussels",
    correctAnswer: "Paris"
};

// Create two more questions
question2 = {
    question: "What is the capital of Italy?",
    answer1: "I",
    answer2: "Milan",
    answer3: "Corsica",
    answer4: "Rome",
    correctAnswer: "Rome"
};

question3 = {
    question: "What is the capital of Norway?",
    answer1: "Oslo",
    answer2: "Stockholm",
    answer3: "Copenhagen",
    answer4: "N",
    correctAnswer: "Oslo"
};

Listing 4.11 - Using the same function with multiple objects - Task 3

Create a function to show the question and answer options.

var question1;
var question2;
var question3;
var showQuestion;    // Declare a variable

question1 = {
    question: "What is the capital of France?",
    answer1: "Bordeaux",
    answer2: "F",
    answer3: "Paris",
    answer4: "Brussels",
    correctAnswer: "Paris"
};

question2 = {
    question: "What is the capital of Italy?",
    answer1: "I",
    answer2: "Milan",
    answer3: "Corsica",
    answer4: "Rome",
    correctAnswer: "Rome"
};

question3 = {
    question: "What is the capital of Norway?",
    answer1: "Oslo",
    answer2: "Stockholm",
    answer3: "Copenhagen",
    answer4: "N",
    correctAnswer: "Oslo"
};

// Define a function
// Assign it to showQuestion
showQuestion = function () {
    console.log(questionToShow.question);
    console.log("(A) " + questionToShow.answer1);
    console.log("(B) " + questionToShow.answer2);
    console.log("(C) " + questionToShow.answer3);
    console.log("(D) " + questionToShow.answer4);
};

Listing 4.11 - Using the same function with multiple objects - Task 4

Use the same variable assignment technique as the original code listing to display all three questions on the console.

var question1;
var question2;
var question3;
var showQuestion;
var questionToShow;    // Declare a variable

question1 = {
    question: "What is the capital of France?",
    answer1: "Bordeaux",
    answer2: "F",
    answer3: "Paris",
    answer4: "Brussels",
    correctAnswer: "Paris"
};

question2 = {
    question: "What is the capital of Italy?",
    answer1: "I",
    answer2: "Milan",
    answer3: "Corsica",
    answer4: "Rome",
    correctAnswer: "Rome"
};

question3 = {
    question: "What is the capital of Norway?",
    answer1: "Oslo",
    answer2: "Stockholm",
    answer3: "Copenhagen",
    answer4: "N",
    correctAnswer: "Oslo"
};

showQuestion = function () {
    console.log(questionToShow.question);
    console.log("(A) " + questionToShow.answer1);
    console.log("(B) " + questionToShow.answer2);
    console.log("(C) " + questionToShow.answer3);
    console.log("(D) " + questionToShow.answer4);
};

// Show the first question
questionToShow = question1;
showQuestion();

// Show the second question
questionToShow = question2;
showQuestion();

// Show the third question
questionToShow = question3;
showQuestion();

The showQuestion function always displays the properties from the object assigned to the questionToShow variable.

To show a different question, assign it to the questionToShow variable before calling the showQuestion function.