Przypsianie kilku zmiennym wartości z tablicy

0

Ok gotowe

let randomIndex = -1;

const btnSubmit = document.querySelector('.btn-submit');

let quizArr = [
    {
        question: 'What is the most used programming language in 2019?',
        answers: [ 'Java', 'C', 'Python', 'JS' ]
    },
    {
        question: 'Who is the President of US?',
        answers: [ 'Florin Pop', 'Joe Biden', 'Ivan Saldano', 'Mihai Andrei' ]
    },
    {
        question: 'What does HTML stand for?',
        answers: [
            'Hypertext Markup Language',
            'Cascading Style Sheet',
            'Jason Object Notation',
            'Helicopters Terminals Motorboats Lamborginis'
        ]
    },
    {
        question: 'What year was JavaScript launched?',
        answers: [ '1996', '1995', '1994', 'none of the above' ]
    }
];

function getRandomQuestion() {
    getRandomVariants();
}

function getRandomVariants() {}

btnSubmit.addEventListener('click', function() {});

od czego najpierw powinienem zacząć?

0

Wiesz staram się pisać kod w miare możliwości sam ale w związku iż jestem początkujący jestem też ciekaw twojej koncepcji na rozwiązanie danego problemu. Oczywiście nie chce żebyś podawał mi rozwiązanie na tacy ale z chęcią naucze się czegoś nowego

1

Zmieniamy nazwy:

  1. Nazwa randomIndex jest niedokładna. W tak prostym kodzie jak Twój problemu nie widać, ale warto sobie wyrobić nawyk nazywania zmiennych możliwie dokładnie (w ogólnym przypadku takie działanie zależy od kilku czynników, między innymi języka programowania). Lepiej: oldQuestionIndex. Bo ta zmienna przechowuje dokładnie to: poprzedni (= "stary") indeks pytania.
  2. Nazwa getRandomQuestion trochę przeczy logice kodu – nie tylko pobierasz pytanie, ale również je wyświetlasz. Ponownie: w taki prostym kodzie nie widać, w większym byłoby widać (np. gdyby miał 10 tys. linii). Lepiej: showRandomQuestion, albo displayRandomQuestion, albo podobnie (jeśli masz jakąś inną propozycję).

Bonus: moim zdaniem, tak bardziej kosmetycznie, warto zmienić deklarację let quizArr. Słowo kluczowe let sugeruje, że zmienna quizArr może się zmieniać (i jednocześnie na to zezwala). Nie chodzi tutaj o zawartość tablicy, tylko to, że tej zmiennej może na przykład zostać przypisana inna tablica. Ponieważ sądzę, że nie planujesz przypisywać tej zmiennej nic innego, to możesz zmienić tę deklarację na const quizArr. Słowo kluczowe const zarówno sugeruje, jak i w ogóle zabrania przypisywania tej zmiennej czegokolwiek innego. Znów: w tak prostym kodzie po prostu pamiętasz, żeby tej zmiennej nic nie przypisywać. W kodzie o 10 tys. linii będzie ciężko pamiętać o wszystkich zmiennych. Lub: gdybyś rozwijał projekt pół roku czy rok, to duża szansa, że zapomniałbyś, że danej zmiennej nie chciałeś na początku nic przypisywać.

1

Najlepiej jakbyś wziął kod z poprzedniej strony i wrzucił w osobną funkcję. Nazwij to np. putAnwsers czy jak tam chcesz, przekazuj tablicę z odpowiedziami i niech ta sobie je losowo porozrzuca po tych obiektach a, b, c, d. Wywołuj to w showRandomQuestion. W ten sposób będziesz miał w miarę działający quiz. Dorzuciłbym też pole correctAnswer do definicji pytań i na tym zbudował np. jakiś licznik punktów.

0

Ok zrobione. Co dalej?

1

Mamy dwa cele; można by je nazwać wymaganiami funkcjonalnymi. Czyli:

  1. po załadowaniu strony wyświetlić losowe pytanie;
  2. po naciśnięciu przycisku "Wyślij" wyświetlić losowe pytanie, różne od bieżącego.

Przy okazji zauważyłem pewien problem. Każde pytanie ma inne odpowiedzi. W związku z tym idea wyświetlania odpowiedzi w losowej kolejności nie ma sensu. Jak myślisz? Chyba że… chciałbyś mieć kolejność odpowiedzi dla danego wyświetlenia danego pytania różną od kolejności odpowiedzi dla poprzedniego wyświetlenia tego pytania?

Niezależnie od Twojej odpowiedzi na te pytania, już teraz możemy zacząć implementować wspomniane dwa wymagania. Umieść wywołanie funkcji showRandomQuestion (nie wiem, jaką nazwę ostatecznie nadałeś) w dwóch miejscach: (1) w handlerze kliknięcia na przycisk btnSubmit, (2) na samym końcu całego kodu.

0

Zrozumiałem zarówno pierwsze jak i drugie pytanie

0

Ok. Teraz jest ok https://jsfiddle.net/tqyovh6a/.

0

Powiedz co dalej mam zrobić. Teraz wychodze z założenia że powinienem zająć się odpowiedziami?

0

Zastanwiałem się czy aby móc losować odpowiedzi mógłbym użyć teoretycznie zagnieżdżonych pętli. Myślałem nad czymś takim https://jsfiddle.net/g58y1n0p/ żeby móc przypisywać kilku wariantom różne odpowiedzi ponieważ obecny kod powoduje coś takiego https://jsfiddle.net/ztwqvk67/1/. Oczywiście to jest tylko poglądowa wersja z tymi pętlami które napisałem ale być może dałoby się zrobić z tego jakiś użytek ponieważ obecne działanie tych pętli odbiego od tego co chciałbym uzyskać

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0