1

I am a complete beginner in JS, please help me. How can I create and populate a similar array in JS? Not through const should be done obviously?

    const questions = [
    {
        questionText: 'What is the capital of France?',
        answerOptions: [
            { answerText: 'New York', isCorrect: false },
            { answerText: 'London', isCorrect: false },
            { answerText: 'Paris', isCorrect: true },
            { answerText: 'Dublin', isCorrect: false },
        ],
    },
    {
        questionText: 'Who is CEO of Tesla?',
        answerOptions: [
            { answerText: 'Jeff Bezos', isCorrect: false },
            { answerText: 'Elon Musk', isCorrect: true },
            { answerText: 'Bill Gates', isCorrect: false },
            { answerText: 'Tony Stark', isCorrect: false },
        ],
    }
];
  • or is it not an array at all? –  Apr 03 '21 at 10:12
  • 3
    I'm missing a lot of context. What do you mean by "similar array"? What do you want to do with this array? Can't you just copy paste what you have above and modify it to whatever you need? – Ivar Apr 03 '21 at 10:14
  • That's an array of objects, that contains arrays of objects (answerOptions). But your question is unclear. – AbsoluteBeginner Apr 03 '21 at 10:19
  • @Ivar I'm trying to make it possible to create such an array and fill it out through the forms on the site, but I can't figure out how to do it. For example, how to make it so that you declare an array, and then manage its elements, which in turn are also an array, inside which the response text and its coreectness –  Apr 03 '21 at 10:20
  • @AbsoluteBeginner In short, I want to use the function to fill in approximately the same array with objects, how do I do this? –  Apr 03 '21 at 10:21
  • See here: https://stackoverflow.com/questions/6254050/how-to-add-an-object-to-an-array – AbsoluteBeginner Apr 03 '21 at 10:25
  • 2
    A complete tutorial on how to modify objects/arrays is a bit too broad for Stack Overflow. You'll be better off following some tutorials. Like [this one](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Arrays). When you run in to some _specific_ problem with this, you can come here. (But be sure to first search for the answers yourself, because the majority of these questions are already answered here on Stack Overflow.) – Ivar Apr 03 '21 at 10:28
  • @Ivar Here I have just a specific question appeared, I have read a lot, I can not understand how to make a variable: questions in which there can be as many other arrays that have a key + value, can you show an example from the question how to do this? –  Apr 03 '21 at 10:37
  • @riprup your question is like "how do I set a variable in javascript" ... well ... use `var` :) you are asking about such a basic thing, that it's even hard to answer – Flash Thunder Apr 03 '21 at 10:38
  • @FlashThunder the question is of course simple, but for me it is difficult. I want to have an empty variable first, and then I can fill it in as I want, and not so that it is set once and for all once –  Apr 03 '21 at 10:41
  • @Riprup but why to make it an empty variable at all? and you can't use `const` and then fill it – Flash Thunder Apr 03 '21 at 10:42
  • @FlashThunder please show me how to fill out const –  Apr 03 '21 at 10:49

1 Answers1

-1

Here you go buddy. Make sure you get the questions and answers in the right json format. and console.log them a few times to check how you can access the data inside the json. Once that is clear you can use these classes and the for loops below to get what you want.

Those who have a problem with this answer let me know in the comments.

Edited: I MADE THE NECESSARY CHANGES. You can add a plus button to add more options

class Question {
  constructor(question, answers) {
    this.question = question;
    this.answers = answers;
  }
}
class Answer {
  constructor(answer, isCorrect) {
    this.answer = answer;
    this.isCorrect = isCorrect;
  }
}

function GetData() {
  var question = document.querySelector('#question').value;
  var options = document.querySelectorAll('.option');
  var checkboxes = document.querySelectorAll('.checkbox');

  var result = [];
  var answerslist = [];
  for (var j = 0; j < options.length; j++) {
    const A = new Answer(options[j].value, checkboxes[j].checked)
    answerslist.push(A);
  }
  const Q = new Question(question, answerslist);
  result.push(Q);
  console.log(result);
}
body {
  box-sizing: border-box;
  overflow-x: hidden;
  font-size: 62.5%;
  padding: 5rem;
}

.Inputarea {
  width: 70%;
  margin: auto;
  height: auto;
  background-color: gainsboro;
  padding: 2rem;
}

input[type="text"] {
  width: 60%;
  margin: 1rem auto;
  border-radius: 0.3rem;
  border: none;
}

input[type="text"] :focus {
  border: 2px solid mediumpurple;
}

input::placeholder {
  color: mediumpurple;
}

button {
  width: 30%;
  margin: 1rem 15%;
  background-color: white;
  font-size: 1rem;
  color: blueviolet;
  border-radius: 0.5rem;
  padding: 0.5rem;
  font-weight: bolder;
  border: none;
}

button:hover {
  background-color: blueviolet;
  color: white;
  transition: all 0.3s ease-in;
}

input[type="checkbox"] {
  margin: 1rem 3rem;
}
<div class="Inputarea">
  <input id="question" type="text" placeholder="Enter Question">
  <input class="option" type="text" placeholder="Enter Option1">
  <input class="checkbox" type="checkbox">
  <input class="option" type="text" placeholder="Enter Option2">
  <input class="checkbox" type="checkbox">
  <input class="option" type="text" placeholder="Enter Option3">
  <input class="checkbox" type="checkbox">
  <input class="option" type="text" placeholder="Enter Option4">
  <input class="checkbox" type="checkbox">
  <button onclick="return GetData();">Submit</button>
</div>