Build a Quiz Game - Accessing Objects Nested in Array

JavaScript
1

Hey guys,

I am trying to get to grips with manipulating data inside an array with nested objects.

When I push my five objects into an array, I can output the whole array on the console. No problem here. But when I try to drill into one of the nested objects, I get the undefined error.

Here is the code I am playing with:

const questions = [];

const obj1 = {
  category: "JavaScript",
  question: "What is JavaScript?",
  choices: ["A declarative language",
              "A programming language",
              "A coffee brand"],
  answer: "A programming language",
};


const obj2 = {
  category: "HTML",
  question: "What is HTML?",
  choices: ["I have no clue", 
            "Hyper Text Markup Language",
            "Some programming language"],
  answer: "Hyper Text Markup Language",
};


const obj3 = {
  category: "CSS",
  question: "What is CSS?",
  choices: ["Name of a company",
              "Some programming language",
              "Cascading Style Sheets"],
  answer: "Cascading Style Sheets",
};


const obj4 = {
  category: "Development Tools",
  question: "What is VSCode?",
  choices: [
    "Development IDE",
    "A coding editor",
    "A coding debugger"],
  answer: "A coding editor",
};


const obj5 = {
  category: "Free Coding Courses",
  question: "What is freeCodeCamps?",
  choices: ["Solicitor's Training Camp",
              "Webdesing Camp",
              "Online Front-end Development Training"],
  answer: "Online Front-end Development Training",
};


questions.push(obj1, obj2, obj3, obj4, obj5);

When I come in with console.log(questions), a get this output:

[ { category: 'JavaScript',
    question: 'What is JavaScript?',
    choices: 
     [ 'A declarative language',
       'A programming language',
       'A coffee brand' ],
    answer: 'A programming language' },
  { category: 'HTML',
    question: 'What is HTML?',
    choices: 
     [ 'I have no clue',
       'Hyper Text Markup Language',
       'Some programming language' ],
    answer: 'Hyper Text Markup Language' },
  { category: 'CSS',
    question: 'What is CSS?',
    choices: 
     [ 'Name of a company',
       'Some programming language',
       'Cascading Style Sheets' ],
    answer: 'Cascading Style Sheets' },
  { category: 'Development Tools',
    question: 'What is VSCode?',
    choices: [ 'Development IDE', 'A coding editor', 'A coding debugger' ],
    answer: 'A coding editor' },
  { category: 'Free Coding Courses',
    question: 'What is freeCodeCamps?',
    choices: 
     [ 'Solicitor\'s Training Camp',
       'Webdesing Camp',
       'Online Front-end Development Training' ],
    answer: 'Online Front-end Development Training' } ]

But when I console.log(questions.obj1) where obj1 is one of the five objects nested in the questions array, I get undefined for all five objects.

Thanks in advance for your help.

2

Ignore that call, guys. I figured it out.

Once we push our objects inside the array, they actually become array items.

So, to call them up, we need to call them up by their array index, not by their object name.