时间戳

首页 > 解决方案 > 如何在 JavaScript 中引用嵌套对象中的对象属性

javascript - 如何在 JavaScript 中引用嵌套对象中的对象属性

问题描述

我正在尝试创建一个包含一组问题和答案的琐事游戏（每个问题都有一个正确答案，但其他 3 个答案将以多项选择格式显示供用户选择）。

我遇到的问题是我不知道如何最好地构造我的对象来实现我的目标。

到目前为止，我已经考虑了以下方法： - 创建一个“问题”对象，其中包括一系列问题、正确答案和每个问题的虚拟答案。IE

var metricQuestions = {
    q1: {
        question: "What is my name?",
        correctAnswer: "Elizabeth",
        incorrectAnswer1: "David",
        incorrectAnswer2: "Fraser"
    },
    q2: {
        question: "What is my dog's name?",
        correctAnswer: "Annie",
        incorrectAnswer1: "Purple",
        incorrectAnswer2: "Face"
    }
};

从体力劳动的角度来看，这种方法很糟糕，因为当我向用户展示问题和正确答案时，我无法从一堆随机的“错误”答案中提取出来。感觉效率低下且重复。

- 分别为“问题”和“答案”创建单独的对象，并在问题对象中引用哪个答案对于特定问题是正确的。语法明智，我无法让它工作。

var metricQuestions = {
    q1: {
        question: "What is First Contentful Paint (FCP)?",
        correctAnswerID = (metricAnswers.a1)
    },
    q2: {
        question: "What is Time to Interactive (TTI)?",
        correctAnswerID: a1
    }
};

我也尝试将正确答案设置为 metricQuestions 对象中的字符串，但是当我随机抽取以填写其他多项选择选项时，我面临着必须处理答案库中潜在重复项的问题（除其他潜在问题外）。

- 我尝试的最后一种方法是嵌套方法，其中同一对象中的属性相互引用。从语法上讲，我遇到了各种各样的错误“未捕获的语法错误：无效的速记属性初始化程序。”

var questionBank = {
    answers: {
        a1: "A lab metric that measures when the main thread is quiet enough to respond to user input.",
        a2: "A field and lab metric that tells when the first pixel is painted on the screen.",
        a3: "Test answer 3.",
        a4: "Test answer 4.",
        a5: "Test answer 5."
    },
    questions: {
        q1: {
        question: "What is First Contentful Paint (FCP)?",
        correctAnswerID = questionBank.answers.a1
        },
        q2: {
        question: "What is Time to Interactive (TTI)?",
        correctAnswerID = questionBank.answers.a2
    },
    }
};

对于多项选择琐事游戏，我怎样才能最有效地让一组问题用相应的正确答案和几个错误答案来洗牌？

标签： javascriptjquery

解决方案

您的 QuestionBank 可以是一个数组，因此您可以在不知道密钥（如 q1、q2 等）的情况下轻松获得随机问题。

QuestionBank 的每个元素都是一个对象 Question，其中包含问题、一个正确答案和一组错误答案，您可以从中选择其中的一些来显示（您可以有 8 个，每次随机选择 3 个）。像这样：

const QuestionBank = [ { 
                         question: "What is my name?",
                         correctAnswer: "Elizabeth",
                         wrongAnswers: ["David", "John", "Julian", "Eugene", "Robert"]
                       },

                       { 
                         question: "What is my dog's name?"
                         correctAnswer: "Annie",
                         wrongAnswers: ["David", "John", "Julian", "Eugene", "Robert"]
                       }];

推荐阅读