Цикл через конструкторы в Java Script

Я собираю онлайн-викторину и хотел бы построить много вопросов. Я сделал конструктор класса (см. ниже). И я настроил переменные для ввода, разные для каждого вопроса. Я хотел бы повторить их конструкцию, но я не вижу, как перебирать и увеличивать имена объектов (например, q1, q2 и т. д.) и аргументы, которые я передаю (например, answer0, answer1 и т. д.), используя конструктор. Любая помощь будет очень признательна! Я думаю, что это имеет смысл, если вы посмотрите на код ниже. Я знаю, что должен быть более эффективный способ.

let quest = []; //array of question objects

//question constructor
class Question {
  constructor(question, answer, hint, icon, congrats, image, location) {
    this.answer = answer;
    this.congrats = congrats;
    this.hint = hint;
    this.icon = icon;
    this.image = image;
    this.location = location;
    this.question = question;
    this.pushToQuest = function () {
      quest.push(this);
    };

    this.pushToQuest();
  }
}

// Question 0 input (actual text removed)
let question0 = "?";
let answer0 = ["", "", "", "", ""];
let hint0 = ["", "", "", "", ""];
let icon0 = "fa-utensils-alt";
let image0 = "img/001.jpg";
let congrats0 = "That's right.... ";
let location0 = '';

const q0 = new Question(
  question0,
  answer0,
  hint0,
  icon0,
  congrats0,
  image0,
  location0
);
    

Там нечего прокручивать. У вас есть только один вопрос, один ответ... одно место

TKoL 10.12.2020 17:11
let questions = [{ "q" : "What is ....", "a" : "It is a ....", "hint":"It is grey", "icon":"🐘", "congrats": "You guessed the elephant","image":"elephant.jpg","location":"Africa" }, { "q" : "What is ....", "a" : "It is a ....", ... }, .... ] Тогда вы можете использовать questions.forEach(q => Object.entries(q).forEach....)
mplungjan 10.12.2020 17:12

@mplungjan Я понял, что если бы он сделал это, класс Question вообще не имел бы никакого смысла, поскольку все, что делает класс Question, — это помещает объекты, которые выглядят не слишком похожими на это, в массив quest

TKoL 10.12.2020 17:14

Спасибо, для уточнения я выложил 1 пример, но есть еще десятки вопросов в том же формате.

Chris Richardson 10.12.2020 17:14

@TKoL Да, точно. Нет смысла в классе вопросов

mplungjan 10.12.2020 17:14

@ChrisRichardson Пожалуйста, перезагрузите, чтобы увидеть мой обновленный комментарий

mplungjan 10.12.2020 17:15

@ChrisRichardson вопросы исходят из базы данных или что-то в этом роде? Как их получить в коде?

TKoL 10.12.2020 17:16
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
7
260
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Возможным решением будет создание файла json, содержащего список объектов вопросов, подобных этому.

[
    {
         "question": "some question",
         "answer": ["", "", "", "", ""];
         "hint": ["", "", "", "", ""];
         "icon": "fa-utensils-alt";
         "image": "img/001.jpg";
         "congrats": "That's right.... ";
         "location": "";
    },
    {
         "question": "some question",
         "answer": ["", "", "", "", ""];
         "hint": ["", "", "", "", ""];
         "icon": "fa-utensils-alt";
         "image": "img/001.jpg";
         "congrats": "That's right.... ";
         "location": "";
    }

]

Затем извлеките данные и используйте цикл for для каждого, чтобы создать конструктор и добавить каждый конструктор в список квестов.

async function (fetchedJson) {
    fetchedJson.forEach((item) => {
        const que = new Question(
            item.question,
            item.answer,
            item.hint,
            item.icon,
            item.image,
            item.congrats,
            item.location
        )

        quest.push(que)
    })
}

Простите мой код, если есть синтаксические ошибки, потому что я печатаю с планшета

Спасибо, это очень полезно

Chris Richardson 10.12.2020 22:06

В основном мой комментарий в ответ

mplungjan 11.12.2020 07:35

Другие вопросы по теме