Как грамотно написать программу для тестирования?

Question

[kiberlain]

Вот придумал себе задачу на выходные) Утром наткнулся на вот эту картинку и подумал "а почему бы не написать программу по вот такому тз?"



В настоящий момент думаю что лучше будет описать всю эту схему в json формате, получится древовидная структура. Пользователь кликает на варианты, некая функция парсит определённый кусок json-а и возращает следующие варианты. И всё такие интересует мнение программистов на javascript. Какое техническое решение вы бы выбрали для такой задачи?

Answer 1

[Rsa97]

Обычное дерево - вопрос, список вариантов ответов с переходами на следующие узлы или листья. Представить можно как угодно, через JSON, XML, заранее подготовленный массив, и т.д.
Можно разместить на странице сразу все блоки во вложенных div'ах и открывать/закрывать нужные по мере выбора ответов.
Можно нарисовать схему в виде SVG и обрабатывать нажатия на элементы выбора подсвечивая пройденный путь.

Answer 2

[DieZz]

Посмотрите паттерн State Machine. Есть уже готовые реализации, например https://github.com/jakesgordon/javascript-state-machine

Answer 3

[Евгений Калибров]

Писал как то мобильное приложение для опросов. Сами опросы с вариантами ответов и всеми ветвлениями хранились в json (массив объектов). Формат примерно следующий:

[
  {
    id: 1,
    title: 'Итак, тебе нужен шрифт',
    desc: 'Начни с того для чего он тебе нужен',
    answers: [
      {
        title: 'Логотип',
        nextQuestion: 2
      },
      {
        title: 'Газета',
        nextQuestion: 3
      },
      {
        title: 'Приглашение',
        nextQuestion: 4
      },
      {
        title: 'Инфографика',
        nextQuestion: 5
      }  
    ]
  },
  {
    id: 2,
    answers: [
      {
        title: 'Без засечек, наверно?',
        nextQuestion: 6
      },
      {
        title: 'Или возможно с засечками?',
        nextQuestion: 7
      } 
    ]
  },
  {
    id: 3,
    answers: [
      title: 'Какого типа газета должна быть?',
      {
        title: 'Текстовая',
        nextQuestion: 8
      },
      {
        title: 'Визуальная',
        nextQuestion: 9
      },
      {
        title: 'Смесь',
        nextQuestion: 10
      } 
    ]
  },
  ........................
]

т.е. это линейный массив, в каждом объекте есть варианты ответов которые ссылаются на следующий объект вопроса. Каждый вопрос может опционально содержать title и desc для более подробного описания сути вопроса .